Laravel中使用Vite加载JS库生产环境报错求助

问题根源 #

你遇到的Unable to locate file in Vite manifest错误，核心原因是Vite的构建清单（manifest）中没有包含你引用的modernizr-webp.js文件：

• 开发环境下Vite会动态处理文件引用，但生产环境依赖预构建的manifest.json，只有被明确标记为入口或主动导入的文件才会被加入清单。
• 你用import.meta.glob('../libraries/**')的默认写法是懒加载模式，Vite不会把这些文件打包到构建产物中，自然不会生成对应的manifest条目。

解决方案 #

方案1：通过同步导入让Vite打包资源 #

修改resources/js/app.js，给import.meta.glob添加eager: true参数，强制Vite同步导入并打包所有匹配的库文件：

import.meta.glob('../libraries/**', { eager: true });

之后删除Blade中单独引用modernizr-webp.js的<script>标签——该文件已经被打包进app.js的bundle中，会通过@vite(['resources/css/app.css', 'resources/js/app.js'])自动加载。

方案2：将文件添加为Vite入口（适合单独加载场景） #

如果需要单独加载modernizr-webp.js，把它加入vite.config.js的input数组：

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/app.css',
                'resources/js/app.js',
                'resources/libraries/modernizr/modernizr-webp.js',
            ],
       }),
    ],
});

然后在Blade中用@vite引用该文件，或继续使用Vite::asset：

@vite('resources/libraries/modernizr/modernizr-webp.js')
@vite(['resources/css/app.css', 'resources/js/app.js'])

额外检查项 #

1. 确认文件路径完全正确：检查resources/libraries/modernizr/modernizr-webp.js是否存在，生产环境服务器通常区分大小写，注意文件名和目录名的大小写匹配。
2. 重新执行构建：在服务器上运行npm run build，检查public/build/manifest.json中是否出现了resources/libraries/modernizr/modernizr-webp.js对应的条目。

内容的提问来源于stack exchange，提问作者Rodrigo Alvarez