根本原因是Apache未启用mod_rewrite模块且DocumentRoot未指向public目录,导致静态资源路径解析失败、重写规则失效;需启用rewrite模块、配置DocumentRoot为public路径、使用asset()或mix()函数引用资源,并确保npm run production已执行。

上线后Laravel页面变成纯文本、所有样式丢失、控制台大量404报错显示/public/css/app.css等资源无法加载,这不是代码写错了,而是服务器配置、构建流程或路径引用三处中至少一处没对齐。
先确认Apache是否启用mod_rewrite模块
Ubuntu + Apache2环境下,这是90%以上CSS不加载的根源。Laravel依赖该模块将 /css/app.css 这类请求直接映射到 public/css/app.css 文件,否则Apache会当作不存在的路径返回404。
执行以下命令启用重写模块:
sudo a2enmod rewrite
重启Apache使配置生效:
sudo systemctl restart apache2
立即学习“前端免费学习笔记(深入)”;
【必须重启,仅启用模块不重启无效】
检查Web服务器DocumentRoot是否指向public目录
如果Apache的根目录仍设在项目根目录(如 /var/www/html/myapp),而非 /var/www/html/myapp/public,则所有静态资源请求都会失败。server.php 或 index.php 路径出现在资源URL中(如 http://site.com/server.php/css/app.css)就是典型错误信号。
编辑虚拟主机配置文件(如 /etc/apache2/sites-available/myapp.conf):
把DocumentRoot 改为项目 public 目录的绝对路径,例如:
DocumentRoot /var/www/html/myapp/public
同时确保
验证Blade模板中是否用asset()或mix()函数引用资源
方法一:全局替换为asset()辅助函数
硬编码相对路径(如 href="css/app.css")在子路由下必然失效。访问 /admin/users 时浏览器会尝试从 /admin/css/app.css 加载资源,而非根路径。
方法二:使用mix()函数(需配合Laravel Mix构建)
这个函数依赖 public/mix-manifest.json 文件。若部署时漏传该文件,或未运行 npm run production,mix() 将返回空字符串或错误路径。
排查Laravel Mix构建与部署环节
第一步:确认是否执行了生产构建
开发用 npm run dev 不生成 manifest,只有 npm run production 才写入 public/mix-manifest.json
第二步:检查 public/mix-manifest.json 是否存在且内容合法
打开该文件,确认内容为类似 {"/js/app.js":"/js/app.js?id=abc123"} 的合法JSON
第三步:核对 mix.js() 和 mix.postCss() 的路径写法
mix.js('resources/js/app.js', 'public/js') ✅ 正确
mix.js('js/app.js', 'js/') ❌ 错误:源路径找不到,输出目录没落在public/下
第四步:确认 APP_URL 配置是否干扰静态资源路径
API项目常把APP_URL设成 https://api.example.com,结果静态资源路径变成 https://api.example.com/css/app.css —— 而API域名根本没托管前端文件。


















