在nwidart/laravel-Module的Auth模块中添加JS脚本遇404错误求助

问题根源 #

你直接硬编码资源路径或使用asset()的方式不对——Vite在Laravel中不会将模块资源直接编译到public/js目录，而是通过manifest文件管理资源映射，必须用Laravel提供的@vite指令来加载，才能自动匹配开发/生产环境的正确资源路径。

解决方案 #

1. 保留现有Vite配置（确认路径正确） #

你的vite.config.js配置已经正确指定了模块资源的输入路径，确保文件实际位置和配置一致：

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'Modules/Auth/Resources/css/app.css',
                'Modules/Auth/Resources/assets/js/app.js'
            ],
            refresh: true,
        }),
    ],
});

2. 在Blade模板中替换为@vite指令 #

把app.blade.php里的<script>标签完全替换成Laravel的Vite指令，它会自动处理资源路径、哈希缓存和热加载：

<body>
    <!-- 其他内容 -->

    <!-- Scripts & Styles -->
    @vite(['Modules/Auth/Resources/css/app.css', 'Modules/Auth/Resources/assets/js/app.js'])
</body>

3. 确保Vite服务运行/资源已编译 #

• 开发环境：执行npm run dev启动Vite热加载服务，确保和Laravel本地服务同时运行
• 生产环境：执行npm run build编译资源，生成public/build目录下的文件和manifest.json，此时@vite会自动加载编译后的资源

为什么原来的写法无效？ #

• 硬编码/js/app.js：Vite编译后的资源默认存放在public/build目录，而非public/js，所以找不到文件
• 使用asset('/js/app.js')：你的JS源文件在模块的Resources/assets/js目录，未被编译到public/js，自然返回404

内容的提问来源于stack exchange，提问作者hydra spectrum