不变性违规：requireNativeComponent：“RNSScreen”在UIManager中找不到。

Question

尽管我已安装所有相关软件包并按照react-navigation指南 (https://reactnavigation.org/docs/getting-started#installation) 进行了操作，但我仍然遇到了RNSScreen错误。请参考以下截图：

- Amit Agrawal

---

请将代码和数据作为文本添加（使用代码格式），而不是图像。 图像：A）无法复制-粘贴代码/错误/数据以进行测试; B）不允许基于代码/错误/数据内容搜索；还有更多原因。 仅当图像添加了只通过文本的代码/错误/数据无法传达的重要信息时，才应在除文本代码/错误/数据之外使用图像。 - cigien

请查看此答案 https://stackoverflow.com/a/67956805/3437900 - Shiva

我只在我的 Android 版本上遇到了这个问题。我已经尝试了您上面提供的所有建议，但都没有成功。请查看我的完整描述问题的问题链接：https://dev59.com/RGwMtIcB2Jgan1zn4A5f - Simon Degn

Answer 1

在实现导航时遇到了相同的问题。运行以下命令：

npm install @react-navigation/native

React Navigation由一些核心实用程序组成，这些实用程序被导航器使用，以在您的应用中创建导航结构。

在您的项目目录中运行：

npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view

这将安装与之兼容的库的版本。

如果您使用的是Mac并且正在开发iOS应用程序，则需要安装pods以完成连接。

npx pod-install ios

现在运行

react-native run-ios

- Gurjinder Singh

---

“npx pod-install ios”和“pod-install ios”有什么区别？ - vikramvi

在我的情况下，我运行了略微不同的命令 pod-install ios 和 npx react-native run-ios。 - vikramvi

这真的很烦人，在两个应用程序中都忘记如何解决它，谢谢大家。 - danyalutsevich

@vikramvi 两者意思完全相同。 - Coder Gautam YT

这是最好的答案，安装Pod并重新启动您的应用程序就是真正的解决办法。 - BoyePanthera

Answer 2

当你安装所有包以添加导航而不终止正在运行的构建时，通常会发生这种情况。确保停止 (android或IOS) 的运行进程，然后在安装它们并添加路由组件后再次运行。

- Mohammed Ramadan

---

也适用于我。只需要“关掉再打开”。 - Asad S

“the running build” 是什么意思？ - Diana

我的意思是运行环境，在这种情况下，我们通常使用yarn start或yarn dev来运行开发环境 :D - Mohammed Ramadan

我认为他指的是地铁... - chenop

这是正确的答案，需要停止并重新运行“npm run android”。 - Quentin

Answer 3

我认为您忘记安装 react-native-screens 组件了。这是按照react navigation指南所需的部分。

在从npm安装包后，请不要忘记在ios文件夹中运行pod install。

- Dat Ho

---

我已经按照文档中的说明安装了它，但是没有起作用。更多信息，我正在使用Windows机器和Android AVD管理器。 - Amit Agrawal

如果你正在为Android构建应用程序，我认为在安装包后应该运行npx jetify。 - Dat Ho

Answer 4

停止所有终端服务器，然后运行。

npx react-native run-android

如果它仍然不起作用，

npm i react-native-screens

然后

npx react-native run-android

- kaizen

---

首先使用以下命令卸载该包：npm uninstall react-native-screens 然后再次安装它：npm install react-native-screens - Man

Answer 5

这个解决方案（source）对我来说总是有效的，以下是确切的解决方案：

简而言之，当你安装用于添加导航的包时，没有终止应用程序的运行构建，就会出现这个问题。

步骤如下：

如果你遇到了这个错误

Invariant Violation: requireNativeComponent: "RNSScreen" was not found in the UIManager.

请按照以下步骤操作：

1. 确保在你的 `package.json` 文件中是否有以下包：

- @react-native-community/masked-view - @react-navigation/native - @react-navigation/stack - react-native-gesture-handler - react-native-reanimated - react-native-safe-area-context - react-native-screens

2. 接下来，确保你的 pods 是最新的（仅适用于 iOS），方法是通过执行以下命令：`cd ios` --> `pod install` --> `cd ..`

3. 最后，通过按下Ctrl+C（两次/三次）来取消当前构建，然后执行 npx react-native run-ios。

- Chaudhry Talha

Answer 6

<只需运行 npm install react-native-screens react-native-safe-area-context 或者如果你使用yarn，则运行 'yarn add install react-native-screens react-native-safe-area-context'

- Amarulloh M Khoeri

Answer 7

关闭 Metro 并运行 npx run android 来重新构建您的代码

- web_walkerX

Answer 8

这种情况在我的iOS和Android设备上都发生了。我通过更新以下包 "react-native-screens": "^3.18.1" 来使 Android 再次正常运行:

然后将其添加到依赖项(dependencies)中: android/app/build.gradle

implementation project(':react-native-screens')

接下来将这个内容添加到 protected List getPackages() 中：android/app/src/main/java/com/myapp/MainApplication.java

@Override
protected List<ReactPackage> getPackages() {
  @SuppressWarnings("UnnecessaryLocalVariable")
  List<ReactPackage> packages = new PackageList(this).getPackages();
  packages.add(new com.swmansion.rnscreens.RNScreensPackage());
  return packages;
}

注意：确保您没有导入com.swmansion.rnscreens，否则应用程序将因重复屏幕视图而不断重新启动。

最后将此添加到android/settings.gradle中。

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

在运行应用之前，请确保您 清理 Gradle。例如，转到Android文件夹并运行以下命令：

./gradlew clean

对于iOS，只需在ios/Podfile的target 'myapp' do中添加这个。

pod 'RNScreens', :path => '../node_modules/react-native-screens'

在运行应用程序之前，请确保删除iOS文件夹中的Podfile.lock，然后运行pod install --repo-update命令。

- Mark Lanham

---

非常感谢。经过许多测试，正是您的解决方案使我能够启动我的应用程序。 - Massimo Alvaro

Answer 9

由于我没有足够的声望来点赞这个答案，所以在这里提到了对我起作用的答案。

问题：使用Expo，Sanity.io应用在开发设备上运行正常，但一旦使用“eas build -p android --profile preview”生成apk后，在手机上打开应用程序时，在启动画面后应用程序崩溃。

Adblogcat显示：com.facebook.react.common.JavascriptException: Invariant Violation: requireNativeComponent：“RNSScreen”在UIManager中未找到。

解决方案:

npm install @react-navigation/native

npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view

感谢社区和@Gurjinder Singh（获得最高票数）。

- vasista k.j

Answer 10

好消息更新：react-native-screens 3.18.2已推出修复此问题。如果你受到了3.18.1版本引起的编译问题（如果需要，可以通过下面的消息检查），则可以使用它来解决问题。

因此，下面的答案大多已经过时，只需更新软件包即可继续使用。干杯！

---

现在，如果发生这种情况，那是因为 react-native-screens 3.18.1 包含了新的配置，只兼容 react-native 0.69+。

如果你正在使用旧版 react-native，则需要确保你的 react-native-screens 依赖项恰好是 3.18.0：

  "react-native-screens": "3.18.0",

如果你遇到了这个问题，可以尝试使用 npx react-native start --reset-cache 命令来重新启动 javascript 打包器并清除缓存。

如果你在运行 npx react-native run-android 命令时看到如下警告信息，则很可能是由此引起的：

警告：由于包含无效配置，“dependency.platforms.android.componentDescriptors”不被允许，因此已忽略 react-native-screens 包

该问题可能会在 3.18.2 版本中得到修复 - 参考：https://github.com/software-mansion/react-native-screens/issues/1614#issuecomment-1276245207

- Mike Hardy

---

对于最近遇到这个警告的人，我刚刚遇到了同样的问题，只有锁定版本“react-native-screens”：“3.13.0”才能解决我的问题，但如果你想要完整的答案，这就是它！ - yaken