“React Native 版本不匹配” 错误

了解 React Native 版本不匹配的含义以及如何在 Expo 或 React Native 应用中解决该问题。


在开发 Expo 或 React Native 应用时,经常会遇到类似这样的错误:

🌐 When developing an Expo or React Native app, it's common to run into an error that looks like:

Terminal
React Native version mismatch.
JavaScript version: X.XX.XNative version: X.XX.X
Make sure you have rebuilt the native code...

这个错误意味着什么

🌐 What this error means

你在终端中运行的打包工具(使用 npx expo start)使用的 react-native JavaScript 版本与设备或模拟器上的原生应用不同。这种情况可能发生在升级 React Native 或 Expo SDK 版本之后,或者当连接到错误的本地开发服务器时。

🌐 The bundler that you're running in your terminal (using npx expo start) is using a different JavaScript version of react-native than the native app on your device or emulator. This can happen after upgrading your React Native or Expo SDK version, or when connecting to the wrong local development server.

如何修复它

🌐 How to fix it

  • 关闭所有正在运行的开发服务器(你可以使用 ps 命令列出所有终端进程,然后用 ps -A | grep "expo\|react-native" 搜索 Expo CLI 或 React Native community CLI 进程)。
  • 如果这是一个 Expo 项目,要么从你的 app.json 文件中删除 sdkVersion 字段,要么确保它与 package.json 文件中 expo 依赖的值相匹配。
  • 如果这是一个 Expo 项目,你应该确保你的 react-native 版本是正确的。运行 npx expo-doctor 会显示警告,告诉你应该安装的 react-native 版本。如果你确实升级到了较新的 SDK,确保运行 npx expo install --fix 并按照提示进行操作。Expo CLI 会确保像 exporeact-native 这样的包的依赖版本保持一致。
  • 如果这是一个裸 React Native 项目,并且在升级你的 React Native 版本后立即发生此错误,你应该仔细检查你是否已正确执行每个升级步骤。
  • 最后:
    • 通过运行 rm -rf node_modules && npm cache clean --force && npm install && watchman watch-del-all && rm -rf $TMPDIR/haste-map-* && rm -rf $TMPDIR/metro-cache && npx expo start --clear 清除你的 bundler 缓存
      • 如果你使用 npm,可以在这里找到相关命令。
      • 如果你使用的是 Windows,可以在这里找到相关命令。
    • 如果这是一个纯 React Native 项目,请先运行 npx pod-install,然后重建你的原生项目(运行 yarn android 来重建 Android,运行 yarn ios 来重建 iOS)