search

wire-elements / wire-extender

Wire Extender allows you to embed any Livewire component on any website or even within a static HTML file.
https://wire-elements.dev/blog/embed-livewire-components-using-wire-extender
MIT License
245 stars 9 forks source link

Question: is AlpineJS automatically available? #17

Closed maltebaer closed 5 months ago

maltebaer commented 5 months ago

Hey @PhiloNL,

Sorry to bother you since I have more of a question than an issue. Is AlpineJS automatically available once we include the asset?

<script src="https://unpkg.com/@wire-elements/wire-extender" data-uri="https://wire-elements.dev"></script>

I'm getting quite confused as I tried to include Alpine via

@assets
    <script
        defer
        src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"
    ></script>
@endassets

The weird part is, that Alpine is working but I can't find it included in my <head> tag. I could understand that it is working out of the box since Livewire relies on it. But then there is a bug in Livewire, since it does not show up in the <head> tag?! 😕

PhiloNL commented 5 months ago

Hi @maltebaer, Alpine is part of Livewire v3 so there is no need to load Alpine manually as an asset (this will likely also result into conflicts). So livewire.js includes Alpine, that's is why it doesn't show up in the <head> tag.

maltebaer commented 5 months ago

Thanks for the quick reply, that makes sense.

One weird thing tough, if you include a script after @vite() it does not make it into the header. So better do

@assets
    <script
        src="https://cdn.jsdelivr.net/npm/pikaday/pikaday.js"
        defer
    ></script>
    @vite('resources/css/components/chatbot.css')
@endassets

and not the other way around. Maybe it'll help someone else.

PhiloNL commented 5 months ago

No problem. Not sure about the @vite problem though, I've never used @assets together with @vite.