React Native报错requireNativeComponent: "RNSScreen"未在UIManager中找到

算力阿峰

2026-9-29

问题定位

你已经正确安装了react-native-screens依赖，无需额外安装其他依赖。报错requireNativeComponent: "RNSScreen" was not found on the UIManager的核心原因是react-native-screens的原生代码未被正确加载，或是导航依赖存在版本冲突。

解决方案

按照以下步骤依次排查即可解决问题：

第一步：清理构建缓存与依赖
进入项目android目录，执行清理命令：
Mac/Linux系统：./gradlew clean
Windows系统：gradlew clean
回到项目根目录，删除旧依赖与锁文件重新安装：
```
rm -rf node_modules package-lock.json yarn.lock
npm install
# 若使用yarn则执行yarn install
```
第二步：检查入口文件配置
在项目入口文件（通常为index.js）的最顶部，添加以下两行导入代码，确保原生模块提前初始化：
```
import 'react-native-gesture-handler';
import 'react-native-screens';
```

第三步：检查导航组件配置
确保你使用@react-navigation/native导出的NavigationContainer组件包裹了所有路由内容，示例结构如下：

import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';

const Stack = createStackNavigator();

function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        {/* 此处填写你的路由页面配置 */}
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;

第四步：处理依赖版本冲突
你的package.json中同时存在旧版4.x的react-navigation和新版6.x的@react-navigation系列依赖，两者会产生兼容性冲突，直接卸载旧版依赖即可：
```
npm uninstall react-navigation react-navigation-stack
# 若使用yarn则执行yarn remove react-navigation react-navigation-stack
```