Vercel部署Next.js/React项目时出现Module Not Found Error求助

问题详情 #

• 本地开发模式运行、生产构建均正常，但部署到Vercel时抛出错误：

  Module not found: Error: Can't resolve './data/navLinks' in '/vercel/path0/src'
  

• 尝试过修改文件名大小写的常见解决方案，无效。
• 删除navLinks文件并将代码整合到其他文件后，出现新的模块找不到错误：

  Module not found: Error: Can't resolve './components/layout' in '/vercel/path0/src'
  

  （备注：layout文件并非代码移入的目标文件）

Vercel部署日志片段 #

WARN  Issues with peer dependencies found
.
├─┬ @babel/plugin-syntax-flow 7.18.6
│ └── ✕ missing peer @babel/core@^7.0.0-0
├─┬ @babel/plugin-transform-react-jsx 7.19.0
│ ├── ✕ missing peer @babel/core@^7.0.0-0
│ └─┬ @babel/plugin-syntax-jsx 7.18.6
│   └── ✕ missing peer @babel/core@^7.0.0-0
└─┬ react-scripts 5.0.1
  └── ✕ unmet peer typescript@"^3.2.1 || ^4": found 5.0.4
Peer dependencies that should be installed:
  @babel/core@">=7.0.0-0 <8.0.0"
Done in 15.5s
Running "pnpm run build"
> @ build /vercel/path0
> react-scripts build
Creating an optimized production build...
Browserslist: caniuse-lite is outdated. Please run:
  npx update-browserslist-db@latest
  Why you should do it regularly: https://github.com/browserslist/update-db#readme
Failed to compile.
Module not found: Error: Can't resolve './components/layout' in '/vercel/path0/src'
 ELIFECYCLE  Command failed with exit code 1.
Error: Command "pnpm run build" exited with 1
Deployment completed
BUILD_UTILS_SPAWN_1: Command "pnpm run build" exited with 1

解决方案 #

• 严格校验文件路径一致性
  本地Windows系统大小写不敏感，但Vercel基于Linux系统（大小写敏感），全局搜索项目中所有navLinks、layout的import语句，确保路径的大小写、文件后缀和实际文件完全匹配（比如避免把Layout.tsx写成layout.tsx，或者省略后缀导致构建识别失败）。
• 修复peer依赖问题
  日志中提示的依赖缺失可能干扰构建环境：
  1. 执行pnpm add -D @babel/core@">=7.0.0-0 <8.0.0"安装缺失的Babel核心依赖；
  2. 要么降级TypeScript到4.x版本（适配react-scripts 5.0.1），要么升级react-scripts至兼容TypeScript 5.x的版本。
• 清理缓存重新部署
  1. 在Vercel项目的部署设置中选择“清除构建缓存”后触发新部署；
  2. 本地执行pnpm cache clean，重新推送代码触发部署。
• 检查.gitignore规则
  确认layout等相关文件未被.gitignore排除，确保所有必要文件都已上传至Vercel服务器。

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