开发服务器未运行或配置错误导致CSS 404,需确认npm run dev已启动且终端显示Local: http://localhost:5173/、vite.config.js中server.host设为true或'localhost'、@vite参数为数组且路径正确、NODE_ENV=development、laravel-vite-plugin已正确加载并启用。

开发模式下 Laravel 页面加载 CSS 时返回 404,浏览器 Network 面板显示请求路径为 /build/assets/app.xxx.css 但实际 public/build/ 目录下空空如也——这不是 Vite 没编译,而是开发服务器根本没启动或未正确接管静态资源请求。
确认 Vite 开发服务器是否真正运行
打开终端,进入项目根目录(含 package.json 和 vite.config.js 的那层),执行:npm run dev 或 yarn dev。不要只看命令行有没有输出,要确认终端里出现类似 ✓ Built in 123ms 和 Local: http://localhost:5173/ 的日志行。
如果只看到 vite v5.x.x dev server running 但没显示 Local 地址,说明 server.host 被错误设为 '0.0.0.0' —— 浏览器出于安全策略会拒绝连接该地址,导致所有 /@vite/client、/build/ 等请求全部失败。
立刻检查 vite.config.js:找到 server 配置项,把 host: '0.0.0.0' 改成 host: true 或显式写 host: 'localhost',然后 Ctrl+C 停掉当前进程,再重新运行 npm run dev。
立即学习“前端免费学习笔记(深入)”;
验证 @vite 指令是否在 Blade 中正确调用
打开你的主布局文件(如 resources/views/layouts/app.blade.php),确认 @vite 出现在 内且是顶层指令,不能嵌套在 @if、@section 或其他 Blade 控制块中。
检查参数是否为数组:✅ @vite(['resources/js/app.js', 'resources/css/app.css']);❌ @vite('resources/css/app.css') 或 @vite(['./resources/css/app.css']) —— 后者路径带 ./ 会导致 laravel-vite-plugin 无法识别入口,静默跳过编译。
【必须确保 resources/css/app.css 文件真实存在】,哪怕内容为空。Vite 插件在初始化阶段会逐个校验 input 数组里的每个路径,缺一个,整个 manifest 生成逻辑就会被跳过,开发服务器也不会注入对应 CSS 的 HMR 请求。
检查 NODE_ENV 是否为 development
在终端执行:echo $NODE_ENV。若输出不是 development,则 Vite 不会启用热更新,@vite 指令也会 fallback 到生产逻辑,试图读取不存在的 manifest.json,从而返回 404。
临时修复:在运行命令前显式设置环境变量:NODE_ENV=development npm run dev。
一劳永逸:修改 package.json 中的 "dev" 脚本,把 "vite" 改成 "NODE_ENV=development vite"(Linux/macOS)或 "set NODE_ENV=development && vite"(Windows CMD)。
排查 laravel-vite-plugin 是否生效
方法一:运行构建调试命令:npx vite build --debug,观察终端输出。若看到 [laravel-vite-plugin] Building manifest,说明插件已激活;若完全无此日志,说明插件未被识别。
方法二:检查 vite.config.js 中 plugins: [] 数组,确认 laravel({ input: [...] }) 是第一个插件,且 import 语句正确:import laravel from 'laravel-vite-plugin' —— 注意不是 vite-plugin-laravel,后者不支持 manifest 生成且已废弃。
如果你用的是 Laravel 9.19+,但从未运行过 php artisan vite:install,那么 laravel-vite-plugin 可能根本没被引入到配置中,手动 import 时极易因包路径错误(比如写成 import laravel from 'laravel-vite-plugin/dist/index')而失败。


















