根本原因是 vite.config.js 中 laravel() 插件的 input 数组遗漏了 css 入口路径，导致 vite 忽略 app.css 的监听与构建；必须显式添加 'resources/css/app.css' 到 input 数组中，并确保文件存在且非空，再运行 npm run build。
在 Laravel 项目中运行 npm run build 后，public/build 下没有生成 CSS 文件，或页面加载时 CSS 404，根本原因不是样式写错了，而是 vite.config.js 中 laravel() 插件的 input 数组遗漏了 CSS 入口路径——Vite 默认不扫描 resources/css/ 目录，必须显式声明。
确认 laravel() 的 input 是否包含 CSS 文件
打开项目根目录下的 vite.config.js，定位到 laravel() 插件调用处。检查其传入的 input 数组是否同时包含 CSS 和 JS 入口：
✅ 正确写法（CSS 和 JS 都在数组中）：
laravel({ input: ['resources/css/app.css', 'resources/js/app.js'] })
❌ 错误写法（只写了 JS）：
laravel({ input: ['resources/js/app.js'] })
这会导致 Vite 完全忽略 app.css，既不监听、也不构建、更不会输出到 public/build/assets/。
【CSS 必须作为独立入口传入 input 数组，不能仅靠 JS 文件里的 import '../css/app.css' 触发构建】——Vite 的 laravel-vite-plugin 在构建阶段只处理 input 列表中的文件及其直接依赖，而 CSS 文件若未列为入口，其 import 链在生产构建中会被跳过。
验证 CSS 是否被正确识别为入口资源
方法一：运行开发服务器并观察控制台日志
执行 npm run dev，在终端输出中查找类似以下行：
✓ 3 modules transformed.
✓ resources/css/app.css → public/build/assets/app.xxxx.css
如果没看到 app.css → ... 这一行，说明它未被插件识别为构建目标。
方法二：手动触发一次构建并检查输出目录
运行 npm run build → 检查 public/build/assets/ 目录下是否存在 .css 文件；若只有 .js 文件，且 manifest.json 中无任何 .css 键值对，则证实 CSS 入口缺失。
修复入口遗漏的三步操作
第一步：编辑 vite.config.js，将 CSS 路径补入 laravel() 的 input 数组
第二步：确保 resources/css/app.css 文件真实存在且非空——如果该文件已被删除或重命名，补回或同步更新路径
第三步：重新运行构建命令 → npm run build → 等待完成 → 检查 public/build/assets/app.*.css 是否生成
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
