Vite清单中无法找到logo.png文件的问题求助

问题背景 #

执行npm run build构建成功，图片已生成在public/build/assets/目录，manifest.json中也存在对应条目，但调用Vite::asset('logo.png')时仍报错：Unable to locate file in Vite manifest: logo.png.

相关信息：

• manifest.json对应配置：

  "resources/images/logo.png": {
    "file": "assets/logo-7b466471.png",
    "src": "resources/images/logo.png"
  },
  

• Blade引用代码：

  <img src="{{ Vite::asset('logo.png') }}">
  

• 已在app.js中添加资源匹配：

  import.meta.glob(["../images/**", "../fonts/**"]);
  

• 环境：Laravel 10.20.0，laravel-vite-plugin 0.8.0，Vite 4.4.9

解决方案 #

1. 修正Blade资源引用路径 #

Vite::asset()的参数必须与manifest.json中的资源key完全匹配。当前manifest里的key是resources/images/logo.png，而非logo.png，修改Blade代码：

<img src="{{ Vite::asset('resources/images/logo.png') }}">

2. 确保资源导入路径准确 #

检查app.js中import.meta.glob的路径层级。若app.js位于resources/js/目录下，../images/**指向resources/images/是正确的，可进一步精确指定文件类型：

import.meta.glob(["../images/**/*.{png,jpg,jpeg}", "../fonts/**/*"]);

3. 验证Vite配置文件 #

确保vite.config.js中Laravel插件配置正确，资源入口与根目录匹配：

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

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

4. 清理缓存并重建 #

• 删除旧构建产物：手动移除public/build目录，或执行命令：

  rm -rf public/build
  

• 重新构建：

  npm run build
  

• 清理Laravel缓存：

  php artisan cache:clear
  php artisan view:clear
  

内容的提问来源于stack exchange，提问作者Uq Dke