此版本的“@react-navigation/native”与 React Navigation 5 不兼容答案

【问题标题】：This version of '@react-navigation/native' is not compatible with React Navigation 5此版本的“@react-navigation/native”与 React Navigation 5 不兼容
【发布时间】：2020-05-21 18:07:33
【问题描述】：

我已经通过

安装了 react-navigation

npm install react-navigation

然后我已经安装了@react-navigation/native via

npm install @react-navigation/native

但出现错误

这个版本的 '@react-navigation/native' 不兼容 React Navigation 5. 确保安装 5.x 版本的 @react-navigation/native

npm -v @react-navigation/native
6.14.4
npm -v react-navigation
6.14.4

【问题讨论】：

你使用的npm版本基本贴出来了。要检查您安装的软件包的版本，您需要查看 package.json。我建议编辑您的问题并将其发布

标签： react-native npm npm-install

【解决方案1】：

在您应用的 package.json 文件中检查以下依赖项及其版本。对我来说，以下解决了上述问题。

 "dependencies": {
"@react-native-community/masked-view": "0.1.6",
"@react-navigation/native": "^5.5.1",
"@react-navigation/stack": "^5.5.1",
"babel-runtime": "^6.26.0",
"expo": "~37.0.3",
"react": "~16.9.0",
"react-dom": "~16.9.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz",
"react-native-gesture-handler": "~1.6.0",
"react-native-reanimated": "~1.7.0",
"react-native-safe-area-context": "0.7.3",
"react-native-screens": "~2.2.0",
"react-native-web": "~0.11.7",
"react-navigation": "^4.3.9"

}

【讨论】：

【解决方案2】：

您不能同时使用 @react-navigation/native v5 和 react-navigation，因为在 v4 之后不再使用 react-navigation 包。

您要使用的每个模块都必须单独安装。

例如： @react-navigation/stack, @react-navigation/bottom-tabs, @..../drawer, ...

您要么需要安装一些对等依赖项。

react-native-screens 处理高性能导航

react-native-reanimated 在您浏览页面时处理过渡动画

react-native-gesture-handler 通过平移手势处理导航

react-native-safe-area-context 处理屏幕控制

@react-native-community/masked-view 处理堆栈导航器头部的特定样式

@react-native-community/toolbar-android 这是 android 工具栏小部件，您需要安装它，因为它已从 0.61 版的“react-native”核心包中删除

【讨论】：