Next.js部署至cPanel后静态文件访问旧构建版本报错求助

可能的原因 #

• cPanel自带的静态文件缓存未彻底刷新
• 部署时旧构建文件未完全清理，新文件覆盖不彻底
• Next.js构建哈希值异常，或服务器资源路径解析规则冲突

具体解决步骤 #

1. 彻底清理旧构建文件 #

先删除cPanel服务器上项目目录下的.next和__next文件夹，不要直接覆盖上传。删除完成后，再重新上传本地npm run build生成的完整构建产物。

2. 配置.htaccess缓存规则 #

在项目根目录创建或修改.htaccess文件，添加以下规则强制浏览器和服务器不缓存Next.js的静态chunk资源：

# 禁用Next.js静态chunk的缓存
<FilesMatch "\.(js|css)$">
    Header set Cache-Control "no-cache, no-store, must-revalidate"
    Header set Pragma "no-cache"
    Header set Expires 0
</FilesMatch>

# 适配Next.js路由规则
RewriteEngine On
RewriteRule ^$ index.html [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . index.html [L]

3. 清理cPanel后台缓存 #

登录cPanel后台，找到「缓存管理器」（部分主机叫「Optimize Website」），选择清除全站缓存，或者针对性清理__next/static/路径下的缓存。

4. 校验构建文件哈希一致性 #

本地执行npm run build后，查看.next/static/chunks下的文件哈希后缀，和服务器上对应文件的哈希对比，确保完全一致。如果不一致，重新上传完整的构建包，避免文件遗漏或损坏。

5. 检查文件权限 #

在cPanel文件管理器中，确保__next/static/目录权限为755，目录内的文件权限为644，权限异常可能导致资源访问被拦截。

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