部署Laravel/Vue/Vite应用遇MIME类型错误：返回text/html而非JS/CSS

问题核心 #

线上服务器未正确区分静态资源请求与Laravel路由请求，所有请求都被转发到index.php返回HTML，导致浏览器请求JS/CSS时收到HTML内容，触发MIME类型检查错误。

解决方案 #

1. 修正服务器配置 #

确保服务器优先处理public目录下的静态文件，找不到时再交给Laravel路由处理：

• Nginx：修改站点配置的location /块：

server {
    root /path/to/your/project/public;

    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }

    # PHP请求处理配置（已有则无需修改）
    location ~ \.php$ {
        fastcgi_pass unix:/var/run/php/php8.2-fpm.sock;
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
        include fastcgi_params;
    }
}

• Apache：确保public/.htaccess文件存在且配置正确（Laravel默认自带）：

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>

    RewriteEngine On

    # 处理授权头
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # 移除尾部斜杠
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # 非静态文件请求转发到index.php
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

2. 验证静态文件完整性 #

确认npm run build生成的public/assets目录下所有文件已完整上传到服务器对应位置，文件名需与manifest.json中file字段完全匹配。

3. 配置正确的APP_URL #

在.env文件中设置线上站点的完整域名：

APP_URL=https://your-domain.com

执行命令刷新配置缓存：

php artisan config:cache

4. 清除浏览器缓存 #

强制刷新页面（Ctrl+F5）或清除浏览器缓存，避免加载旧的资源路径缓存。

内容的提问来源于stack exchange，提问作者Sam Bradshaw