Sebastian De Deyne

Vite with Laravel: Auto-refresh Blade views

∙ 1 min. read ∙ Vite with Laravel ∙ #laravel #vite #frontend #buildtools #blade

We’re up and running, but there’s another Laravel-specific quality of life improvement we can make: auto-refreshing when a Blade file changes.

To do this, we’ll write a simple Blade plugin right inside the Vite configuration.

I didn’t write this plugin myself, this is an except from innocenzi/laravel-vite.

The plugin listens to changes in .blade.php files, and does a full reload when they change.

// vite.config.js
export default ({ command }) => ({
    base: command === 'serve' ? '' : '/build/',
    outDir: 'public/build',
    publicDir: 'fake_dir_so_nothing_gets_copied',
    build: {
        manifest: true,
        rollupOptions: {
            input: 'resources/js/app.js',
    plugins: [
            name: 'blade',
            handleHotUpdate({ file, server }) {
                if (file.endsWith('.blade.php')) {
                        type: 'full-reload',
                        path: '*',

More Laravel, Vite, Frontend, Build tools & Blade

Vite with Laravel

The revamped Spatie guidelines

Laravel Typescript Transformer