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
208 stars 6 forks source link

Question: is AlpineJS automatically available? #17

Closed maltebaer closed 1 month ago

maltebaer commented 1 month 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 1 month 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 1 month 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 1 month ago

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