Issue with Integrating Laravel Modules and Vite in a Laravel 11 + Nuxt 3 Project

[sergefy13]

I'm working on a project using Laravel 11 with Vite and Nuxt 3 for the frontend. I’m using nwidart/laravel-modules to organize my application into modules that contain both backend logic and frontend resources (Vue components, pages, assets, etc.).

I’m trying to integrate Vite to compile assets from these modules, but I’m running into issues where the assets are not being compiled at all, and the logs don’t show anything. Below are the details:

Project Structure:

Modules are located under /Modules/ModuleName/. The frontend resources for each module are under /Modules/ModuleName/resources/nuxt/app/ (e.g., components, pages). The main Nuxt directory is /nuxt/, and the root configuration file nuxt.config.ts uses rootDir: "nuxt/". Vite Configuration: I’m following your documentation and using collectModuleAssetsPaths to gather paths to the frontend assets in the modules and pass them to Vite. Here’s my Vite configuration:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import collectModuleAssetsPaths from './vite-module-loader.js';
import path from 'path';

async function getConfig() {
    const paths = [
        'resources/css/app.css',
        'resources/js/app.js',
    ];

    // Collecting asset paths from modules
    const allPaths = await collectModuleAssetsPaths(paths, 'Modules');

    return defineConfig({
        plugins: [
            laravel({
                input: allPaths,
                refresh: true,
            })
        ],
        resolve: {
            alias: {
                '@modules': path.resolve(__dirname, 'Modules'),
            },
        },
        server: {
            fs: {
                allow: [
                    path.resolve(__dirname, 'Modules'),
                    path.resolve(__dirname, 'resources'),
                    path.resolve(__dirname, 'public')
                ]
            },
            watch: {
                usePolling: true,
                interval: 100,
            }
        }
    });
}

export default getConfig();

But the thing is that by calling npm run dev I call 'nuxt dev'... I tried also call 'nuxt dev && vite'.

The Issue:

Assets from the modules are not being compiled at all. The logs are not showing anything regarding the compilation of assets from the modules. I’m using chokidar to monitor file changes in the module directories, but it only detects changes in the main nuxt/ directory and does not pick up changes from the module directories. I have also tried manually copying files from the modules to the Nuxt directory, but nothing happens. The assets are not being moved or compiled. Enabling usePolling and clearing Vite’s cache didn't resolve the issue. What I’ve Checked:

I’ve verified that collectModuleAssetsPaths is returning correct paths, but assets still don’t compile. Manually running the copy scripts doesn’t seem to trigger any compilation or copying of files. File permissions for the module and Nuxt directories are correctly set. Questions:

Are there any specific requirements or nuances for integrating Vite with Laravel Modules in a setup like this? What would be the best approach to ensure that assets from the modules are compiled correctly in a Laravel + Vite + Nuxt 3 environment? Are there any known issues with using chokidar or the server.fs.allow configuration in such scenarios? Any guidance would be greatly appreciated!