Laravel Vite not updating Vue.js components outside ./resources/js/Pages directory

Viewed 46

I have a Laravel 9 project with Vue.js 3 and Inertia.js.

When I update a Vue components outside the ./resources/js/Pages directory Vite isn't updating the changes automatically. I need to completely restart the Vite server (npm run dev) to get the changes.

When I update a Vue file in the ./resources/js/Pages directory Vite is updating the changes.

Vite.config.js:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';
import path from 'path';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/js/app.js'],
            refresh: true,
        }),
        vue({
            template: {
                transformAssetUrls: {
                    base: null,
                    includeAbsolute: false,
                },
            },
        }),
    ],
    resolve: {
        alias: {
            '~bootstrap': path.resolve(__dirname, 'node_modules/bootstrap'),
        }
    },
});

App.js:

import './bootstrap';
import '../scss/app.scss';

import { createApp, h } from 'vue';
import { createInertiaApp } from '@inertiajs/inertia-vue3';
import { InertiaProgress } from '@inertiajs/progress';
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
import { ZiggyVue } from '../../vendor/tightenco/ziggy/dist/vue.m';

const appName = window.document.getElementsByTagName('title')[0]?.innerText || 'Laravel';

createInertiaApp({
    title: (title) => `${title} - ${appName}`,
    resolve: (name) => resolvePageComponent(`./Pages/${name}.vue`, import.meta.glob('./Pages/**/*.vue')),
    setup({ el, app, props, plugin }) {
        const myApp = createApp({ render: () => h(app, props) });
        myApp.use(plugin);
        myApp.use(ZiggyVue, Ziggy);

        myApp.mount(el);

        return myApp;
    },
});

InertiaProgress.init({ color: '#055CFC' }); //#4B5563

How can I fix it so that Laravel Vite will update my changes?

0 Answers
Related