Laravel Mix怎么用｜前端编译教程

Laravel Mix看似简单上手，实则暗藏诸多易被忽视的关键细节：路径必须严格基于项目根目录书写、输出必须落在public目录下、manifest文件仅在production模式生成且必须随部署上传，否则Blade中mix()辅助函数将直接导致静态资源404；同时，模块化编译推荐用JSON配置驱动而非硬编码判断，扩展Webpack配置应避免粗暴覆盖而优先使用extend或精准补丁。真正卡住90%开发者的，从来不是语法本身，而是对路径来源、文件流向、manifest机制及服务器寻址逻辑这一整套约束边界的系统性理解。

直接能跑通，但 90% 的人卡在路径、输出位置和部署环节。

mix.js() 和 mix.postCss() 的路径必须写对

这两个方法的第一个参数是源文件路径，第二个是输出目录（不是完整文件名），且都必须基于项目根目录的相对路径 —— 不能用 ./ 开头，也不能用绝对路径。

• mix.js('resources/js/app.js', 'public/js') ✅ 正确：源文件存在，输出目录为 public/js/
• mix.js('js/app.js', 'js/') ❌ 错误：源路径找不到，输出目录没落在 public/ 下，Blade 中