Expo SDK 49升级至50后，模拟器加载项目遇Metro解析react模块错误

问题描述 #

Metro 遇到错误：尝试从文件 'App.tsx' 解析模块 react 时，成功找到包 'node_modules/@types/react/package.json'，但该包指定的 'main' 模块字段 'node_modules/@types/react/index' 无法解析，相关文件均不存在。

问题根源 #

从提供的package.json来看，存在两处关键冲突：

• resolutions字段强制指定@types/react为18.2.0，但devDependencies中@types/react版本是~18.2.14，版本不一致导致依赖安装异常，@types/react包缺少必要的入口文件；
• Expo SDK 50 要求 React 版本为18.2.0，手动强制类型包版本反而破坏了Expo自动维护的依赖匹配关系。

修复步骤 #

1. 修正依赖版本配置 #

• 删除package.json中的resolutions字段，Expo项目无需手动强制类型包版本：

  // 移除以下内容
  "resolutions": {
      "@types/react": "18.2.0",
      "@types/react-dom": "18.2.0"
  }
  

• 将devDependencies中的@types/react版本修改为与React本体完全一致的18.2.0：

  "@types/react": "18.2.0"
  

2. 清理缓存并重新安装依赖 #

• 删除node_modules文件夹：

  rm -rf node_modules
  

• 删除对应的锁文件（根据你使用的包管理器选择）：

  # npm 用户
  rm package-lock.json
  
  # yarn 用户
  rm yarn.lock
  

• 清除Metro缓存并重启项目：

  npx expo start --clear
  

• 重新安装依赖：

  # npm 用户
  npm install
  
  # yarn 用户
  yarn install
  

3. 验证修复效果 #

进入node_modules/@types/react目录，确认存在index.d.ts文件（Metro错误中提到的index实际是省略了.d.ts后缀的类型文件，只要该文件存在即可正常解析）。

4. 额外排查（若问题仍存在） #

• 检查metro.config.js是否有自定义解析规则，确保未错误排除@types/react相关文件；
• 确认babel.config.js使用Expo默认配置，无需额外修改React模块的解析逻辑。

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