如何在已 eject 的 Expo 项目中安装 React Navigation？解决RNSScreen报错

具体修复步骤 #

• 重新安装核心依赖并确保链接
  执行命令重装依赖，覆盖可能损坏的安装文件：

  npm install react-native-screens react-native-safe-area-context
  # 若使用yarn则执行
  yarn add react-native-screens react-native-safe-area-context
  

• 手动校验原生项目配置
  • iOS端：进入ios目录，先删除Podfile.lock和Pods文件夹，再执行pod install，完成后重新编译项目。
  • Android端：
    1. 打开android/settings.gradle，确认包含以下配置：

       include ':react-native-screens'
       project(':react-native-screens').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-screens/android')
       include ':react-native-safe-area-context'
       project(':react-native-safe-area-context').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-safe-area-context/android')
       

    2. 打开android/app/build.gradle，确认依赖列表里有：

       implementation project(':react-native-screens')
       implementation project(':react-native-safe-area-context')
       

    3. 进入android目录执行缓存清理：

       ./gradlew clean
       

• 清除项目缓存并重启服务

  rm -rf node_modules package-lock.json yarn.lock
  npm cache clean --force
  npm install
  npx react-native start --reset-cache
  

• 版本兼容性检查
  确保React Navigation版本与react-native-screens匹配，比如React Navigation 6.x要求react-native-screens版本≥3.0.0。

关键提示 #

Expo eject后的裸React Native项目，所有原生依赖无法像Managed Expo项目那样自动配置，必须手动确认每个依赖的原生链接是否完成。如果上述步骤无效，可以尝试备份原生配置后删除ios、android目录，重新执行npx react-native eject，再重复上述安装配置流程。

内容的提问来源于stack exchange，提问作者Furkan Türkyılmaz