Closed karlgray closed 3 years ago
Hey @karlgray,
I can't understand their error. I am using Laravel Jetstream with Livewire.
Below is the body part of app.blade.php
// resources/views/layouts/app.blade.php
<body class="font-sans antialiased">
<x-jet-banner />
<div class="min-h-screen bg-gray-100">
@livewire('navigation-menu')
<!-- Page Heading -->
@if (isset($header))
<header class="bg-white shadow">
<div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
{{ $header }}
</div>
</header>
@endif
<!-- Page Content -->
<main>
{{ $slot }}
</main>
</div>
@stack('modals')
@stack('scripts')
@livewire('livewire-ui-modal')
@livewireUIScripts
@livewireScripts
</body>
Did you run php artisan vendor:publish --tag=livewire-ui:public --force
?
You can also alternatively add require('../../vendor/livewire-ui/modal/resources/js/modal');
in resources/js/app.js
, instead of @livewireUIScripts
.
After that you still need to run npm run dev
.
// resources/js/app.js
require('./bootstrap');
require('alpinejs');
require('../../vendor/livewire-ui/modal/resources/js/modal');
I hope I could help you.
I was going to post a response today. I spent last night trying to figure out what was going on... Came back today and tested it was the cause and confirmed.
It turns out that I screwed up. While trying to figure out the modals I had run this command. php artisan livewire:make modals.modal prior to installing livewire-ui/modals.
It was this that was causing the conflict. I have now deleted it (not actually needed) and this resolved the issue.
My apologies for this issue and any time you put into it @sotten
I am new to Laravel, this being my first project so please forgive me if this is obvious I just spent an hour+ figuring this out and thought it may be useful to someone else.
In app.blade.php adding
Directly above @livewireScripts doesn't work. Modals will not work.
You have to add it above @stack('modals')
I am not sure why these conflict with each other like this?