Next.js 13应用Vercel部署报错：Cannot find module

部署Next.js 13应用到Vercel时，添加Parallel Routes（@landing）后分支部署成功但访问出现500错误，日志显示找不到/var/task/.next/server/app/@landing/page.js，可按以下思路排查解决：

1. 确认目录结构与文件命名正确性 #

Parallel Routes的目录结构必须严格符合Next.js要求：

• 确保@landing目录直接放在app目录下，结构为：

  app/
    @landing/
      page.jsx
    layout.jsx
    ...其他核心文件
  

• 检查文件名大小写：Vercel使用Linux环境区分大小写，本地Windows/macOS不区分，需确保@landing目录、page.jsx文件名完全匹配（比如不要写成Page.jsx或@Landing）。
• 确认page.jsx是默认导出组件，你的代码中export default LandingPage写法正确。

2. 清理Vercel构建缓存 #

Vercel的构建缓存可能导致旧文件残留，尝试：

• 进入Vercel项目对应分支的部署记录页面
• 点击「Redeploy」按钮，勾选「Skip Cache」选项后重新部署

3. 对齐Node.js版本 #

本地与Vercel的Node.js版本不一致可能导致构建差异：

• 在项目根目录的package.json中添加engines字段，指定与本地一致的Node.js版本，例如：

  "engines": {
    "node": ">=18.17.0"
  }
  

• 提交修改到GitHub后触发Vercel重新部署

4. 检查Next.js版本与构建配置 #

• 你的Next.js版本为13.12.4，可尝试升级到最新稳定版（如13.5.x），修复可能存在的Parallel Routes构建bug
• 确认next.config.js中experimental.appDir已开启，你的配置无需修改

5. 本地构建验证 #

本地执行npm run build后，检查.next/server/app/@landing目录下是否生成了page.js文件：

• 如果本地存在该文件，说明问题出在Vercel构建环境，可尝试更换构建区域或联系Vercel支持
• 如果本地也不存在，说明Parallel Routes使用逻辑有误，重新核对Next.js官方Parallel Routes的使用规范

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