应清理残留mix-manifest.json及旧哈希文件并重建:先删public/mix-manifest.json,再清空public/js/和public/css/下带哈希的文件(保留app.js/app.css),确认package.json中production脚本为mix --production,最后运行npm run production验证新manifest与文件一致性。

部署新版本前端资源后,页面样式突然错乱或部分CSS未更新,浏览器控制台显示加载了旧哈希名的CSS文件,大概率是上一次构建生成的mix-manifest.json残留干扰了当前版本的路径映射。
确认mix-manifest.json是否为当前版本产物
进入项目根目录下的public/子目录,执行ls -l mix-manifest.json查看文件修改时间;若该时间早于最近一次npm run production执行时间,说明文件未被覆盖,仍指向旧资源哈希。
用cat public/mix-manifest.json查看内容,检查其中CSS路径对应的哈希值(如"/css/app.css": "/css/app.abc123.css")是否与public/css/目录下实际存在的文件名完全一致;【不一致即证明manifest已失效,必须清理重生成】。
彻底清理残留manifest与旧资产
第一步:删除public/mix-manifest.json文件。
立即学习“前端免费学习笔记(深入)”;
第二步:清空public/js/和public/css/目录下所有由Mix生成的带哈希后缀的文件(如app.1a2b3c.js、app.d4e5f6.css),但保留原始入口文件(如app.js、app.css)——这些只是源码占位,不影响编译。
第三步:确认package.json中"scripts"里的"production"命令确为"mix --production"或"npm run build"(Laravel Mix v6+默认等价),避免误配成"cross-env NODE_ENV=development mix"这类开发模式指令。
强制重建并验证
运行npm run production,等待终端输出Done in X.XXs.且无ERROR字样。
检查public/mix-manifest.json是否重新生成,内容是否为合法JSON、键值对路径正确、哈希值与public/下对应文件名吻合。
方法一:在Blade模板中使用{{ mix('css/app.css') }},访问页面后查看源码中link标签href属性是否为新哈希路径;
方法二:直接curl -I http://your-domain.com/css/app.newhash.css,确认返回HTTP 200而非404。


















