Laravel Vite manifest.json生成失败?构建日志检查

风杰同学_8493

风杰同学_8493

2026-08-10

562人浏览

原创

manifest.json缺失、为空或格式非法会导致@vite失效并引发404和白屏;必须显式配置build.manifest: true,确保laravel-vite-plugin正确加载且input路径存在、合法、可读,并验证manifest键值对及对应资源文件是否真实存在。

laravel vite manifest.json生成失败?构建日志检查

当你执行 vite build 后,public/build/manifest.json 文件缺失、为空或格式非法,Laravel 的 @vite 指令就会彻底失效,所有前端资源返回 404,页面白屏或 JS/CSS 不加载——这不是缓存问题,而是构建流程在源头就中断了。

确认 vite.config.js 是否启用 manifest

打开项目根目录下的 vite.config.js(或 .ts),检查 build 配置项中是否明确写了 manifest: true:

✅ 正确写法(必须显式声明):
复制AI写代码

export default defineConfig({<br>  plugins: [laravel({ input: ['resources/js/app.js'] })],<br>  build: { manifest: true }<br>});

❌ 错误写法:漏掉 build: { manifest: true },或仅写 manifest: true 却没包裹在 build 对象里。Vite 不会默认开启该功能,不写就等于关闭。

验证 laravel-vite-plugin 是否被正确加载

方法一:检查插件是否在 plugins: [] 数组中且位置靠前
laravel-vite-plugin 必须位于其他构建插件(如 vue()、react())之前,否则它无法接管入口解析与 manifest 生成逻辑。

方法二:运行 vite build --debug 观察终端输出
若看到 [laravel-vite-plugin] Building manifest... 或类似日志,则插件已激活;若完全无此提示,说明插件未被识别——常见原因是 import laravel from 'laravel-vite-plugin' 路径错误,或 npm 包未安装(npm install laravel-vite-plugin)。

【注意】 如果你用的是 Laravel 9.19+,但没运行过 php artisan vite:install,则 laravel-vite-plugin 可能未被自动引入到配置中,手动 import 也容易因路径错漏失败。

OpenGemini Next.js Bestpractice Builder
OpenGemini Next.js Bestpractice Builder

使用固定的 Next.js/Tailwind/Prisma 技术栈构建并记录独立 SaaS 项目,仅将 FastAPI 用于 Python 工作负载,并遵循严格的架构规范。

下载

检查构建入口路径是否存在且可读

第一步:确认 vite.config.js 中 laravel() 的 input 数组里每个路径都真实存在
例如:laravel(['resources/js/app.js', 'resources/css/app.css']) → 必须确保 resources/js/app.js 这个文件物理存在,哪怕内容为空。缺一个,整个插件初始化就会静默跳过,manifest 不生成。

第二步:禁止使用相对路径或别名
laravel(['./resources/js/app.js']) ❌、laravel(['@/js/app.js']) ❌ —— laravel-vite-plugin 只认以 resources/ 开头的绝对路径(相对于项目根目录),否则无法映射源码路径到产物,manifest 键名将为空或错乱。

第三步:检查文件权限
Linux/macOS 下若 resources/js/app.js 权限为 000 或属主不符,Vite 构建时读取失败却无明显报错,manifest.json 会生成空对象 {} 或直接不创建文件。

运行构建并逐级验证输出

① 在项目根目录执行:npm run build(或 yarn build / pnpm build)

② 立即检查 public/build/manifest.json 是否生成:
→ 若文件不存在:说明构建中途退出,回看终端最后一行错误(常见如 TypeScript 类型错误、Vue SFC 解析失败、缺少 @vitejs/plugin-vue);
→ 若文件存在但内容为空或仅为 {}:大概率是入口路径不存在,或 laravel() 插件根本没执行;
→ 若文件内容为合法 JSON 但键名不是 "resources/js/app.js" 这类路径:说明 input 配置被忽略,可能用了自定义插件覆盖了 laravel 插件逻辑。

③ 打开 manifest.json,确认至少有一条有效映射,例如:
{"resources/js/app.js": {"file": "assets/app.abc123.js", "css": ["assets/app.def456.css"]}}
键名必须是源码路径,值对象必须含 file 字段——缺少任一,Laravel 的 @vite 就无法解析出真实资源地址。

④ 同步检查 public/build/assets/ 目录下是否存在对应文件名的 JS/CSS 文件
例如 manifest 中 "file": "assets/app.abc123.js",则 public/build/assets/app.abc123.js 必须真实存在且非空。若文件缺失,说明构建压缩/输出阶段失败,需查看 Vite 构建日志中 ✓ built in XXXms 前的 warning 或 error。

相关专题

更多
laravel组件介绍
laravel组件介绍

laravel 提供了丰富的组件,包括身份验证、模板引擎、缓存、命令行工具、数据库交互、对象关系映射器、事件处理、文件操作、电子邮件发送、队列管理和数据验证。想了解更多laravel的相关内容,可以阅读本专题下面的文章。

2024.04.09

857

10

laravel中间件介绍
laravel中间件介绍

laravel 中间件分为五种类型:全局、路由、组、终止和自定。想了解更多laravel中间件的相关内容,可以阅读本专题下面的文章。

2024.04.09

835

9

laravel使用的设计模式有哪些
laravel使用的设计模式有哪些

laravel使用的设计模式有:1、单例模式;2、工厂方法模式;3、建造者模式;4、适配器模式;5、装饰器模式;6、策略模式;7、观察者模式。想了解更多laravel的相关内容,可以阅读本专题下面的文章。

2024.04.09

2468

10

thinkphp和laravel哪个简单
thinkphp和laravel哪个简单

对于初学者来说,laravel 的入门门槛较低,更易上手,原因包括:1. 更简单的安装和配置;2. 丰富的文档和社区支持;3. 简洁易懂的语法和 api;4. 平缓的学习曲线。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2024.04.10

3941

7

laravel入门教程
laravel入门教程

本专题整合了laravel入门教程,想了解更多详细内容,请阅读专题下面的文章。

2025.08.05

5630

22

laravel实战教程
laravel实战教程

本专题整合了laravel实战教程,阅读专题下面的文章了解更多详细内容。

2025.08.05

3756

13

laravel面试题
laravel面试题

本专题整合了laravel面试题相关内容,阅读专题下面的文章了解更多详细内容。

2025.08.05

7049

7

PHP高性能API设计与Laravel服务架构实践
PHP高性能API设计与Laravel服务架构实践

本专题围绕 PHP 在现代 Web 后端开发中的高性能实践展开,重点讲解基于 Laravel 框架构建可扩展 API 服务的核心方法。内容涵盖路由与中间件机制、服务容器与依赖注入、接口版本管理、缓存策略设计以及队列异步处理方案。同时结合高并发场景,深入分析性能瓶颈定位与优化思路,帮助开发者构建稳定、高效、易维护的 PHP 后端服务体系。

2026.03.04

1416

29

Laravel 框架安装指南
Laravel 框架安装指南

本指南详解 Laravel 框架安装全流程,涵盖 PHP 8.1+ 环境配置、Composer 依赖管理工具安装及国内镜像源优化。重点演示使用 composer create-project 命令创建 Laravel 10/11 项目,解决常见安装错误与依赖冲突。从环境搭建到项目初始化,助您快速完成 Laravel 开发环境部署,为后续 Web 应用开发奠定基础。适合 PHP 初学者与框架迁移开发者参考。

2026.04.09

215

6

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
如何安装 Composer
如何安装 Composer

共1课时 | 206人学习

Composer手册
Composer手册

共0课时 | 0人学习