RN遇到问题及解决方案总结（持续更新）

森林北晴的学习之路

已于 2024-02-25 18:09:37 修改

阅读量1.8k

点赞数 9

文章标签： react native

于 2024-01-11 21:15:57 首次发布

本文链接：https://blog.csdn.net/weixin_55703679/article/details/135539130

版权

1.【问题一】Cannot start server in new window because no terminal app was specified.

解决方案:

运行如下命令

npm run start

2.【问题二】TypeError [ERR_INVALID_CHAR]: Invalid character in header content ["X-React-Native-Project-Root"]

解决方案：

转到node_modules/@react-native-community/cli-server-api/build/statusPageMiddleware.js
在第 19 行，将 process.cwd（）包装成新的 URL（），如下所示：
new URL(process.cwd())
在重新加载清理缓存之前npm using npm cache clean --force
运行方式npm run start / npm run android

3、react-navigation报错requireNativeComponent: “RNSScreenStackHeaderConfig“ was not found in the UIManage

解决方案：

App.tsx代码：

import React from 'react';
import {
  SafeAreaView,
  ScrollView,
  StyleSheet,
  Text,
  View,
} from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
 
const Stack = createNativeStackNavigator();
 
const HomeScreen = () => {
  return (
    <View>
      <Text>首页</Text>
    </View>
  )
}
 
const MyScreen = () => {
  return (
    <View>
      <Text>我的</Text>
    </View>
  )
}
 
const App = () => {
  return (
    <NavigationContainer>
      <Stack.Navigator initialRouteName="Home">
        <Stack.Screen name="Home" component={HomeScreen} />
        <Stack.Screen name="Details" component={MyScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
};
 
const styles = StyleSheet.create({
 
});
 
export default App;

配置：Stack.Navigator initialRouteName="Home"，且配置至少2个Stack.Screen 页面。

步骤：然后重启yarn android。如果仍然报错requireNativeComponent: "RNSScreenStackHeaderConfig" was not found in the UIManager，则需要删除android\app\build\outputs\apk\debug目录下的打包的apk文件，

<Stack.Navigator initialRouteName="Home">
   <Stack.Screen name="Home" component={HomeScreen} />
   <Stack.Screen name="Details" component={MyScreen} />
</Stack.Navigator>