2 years ago

Vite is the new front-end tooling for Laravel. https://vitejs.dev/ is the Next Generation Frontend Tooling, which is Laravel's default from now on.

When working with Laravel Livewire, our components often have different states, depending on the current data.

import {defineConfig} from 'vite'; import laravel from 'laravel-vite-plugin'; import livewire from '@defstudio/vite-livewire-plugin'; export default defineConfig({ plugins: [ laravel([ 'resources/css/app.css', 'resources/js/app.js', ]), livewire({ refresh: ['resources/css/app.css'], }), ], }); And last, add the reload manager to your main JavaScript file. import { livewire_hot_reload } from 'virtual:livewire-hot-reload' livewire_hot_reload(); No we can start Vite through npm run dev, and you should see a console message that the Vite Livewire plugin is successfully enabled.