我正在尝试使用@react-navigation/drawer，但它无法正常工作

Question

这是我的app.js代码

import React from 'react';
import {
  SafeAreaView,
  ScrollView,
  StatusBar,
  StyleSheet,
  Text,
  useColorScheme,
  View,
} from 'react-native';
import { createDrawerNavigator } from '@react-navigation/drawer';
import { NavigationContainer } from '@react-navigation/native';
import Home from './src/components/Home';
import Login from './src/components/Login';

const Drawer = createDrawerNavigator();
function App() {
  return(
    <NavigationContainer>
    <Drawer.Navigator>
      <Drawer.Screen name="Home" component={Home} />
      <Drawer.Screen name="Login" component={Login} />
    </Drawer.Navigator>
    </NavigationContainer>
  )
}

export default App;

这是我的依赖包

"dependencies": {
    "@react-navigation/bottom-tabs": "^6.2.0",
    "@react-navigation/drawer": "^6.3.1",
    "@react-navigation/native": "^6.0.8",
    "@react-navigation/native-stack": "^6.5.1",
    "react": "17.0.2",
    "react-native": "^0.65.0",
    "react-native-gesture-handler": "^1.10.3",
    "react-native-reanimated": "^1.13.2"
  },

错误

错误类型错误：null不是对象（评估'_ReanimatedModule.default.createNode'） 错误不变违规：模块 AppRegistry 不是已注册的可调用模块（调用 runApplication）。导致该错误的常见原因是应用程序入口文件路径不正确。 当 JS 包损坏或加载 React Native 时出现早期初始化错误时，也可能会发生这种情况。 错误不变违规：模块 AppRegistry 不是已注册的可调用模块（调用 runApplication）。导致该错误的常见原因是应用程序入口文件路径不正确。 当 JS 包损坏或加载 React Native 时出现早期初始化错误时，也可能会发生这种情况。

当我尝试启动反应本机时，出现此错误......

请任何人帮助我并纠正我

Answer 1

我遇到了同样的错误。 将react-native-reanimated版本升级到[电子邮件受保护]解决了我的问题

我用的是

npm install [email protected]

，卸载之前的版本后

Answer 2

我删除了我的node_modules文件夹，然后

yarn install

然后我安装了

[email protected]

，它的工作就像一个魅力。

Answer 3

我遇到了相同/类似的问题，并且不得不奋斗 2 天才能找到适合我的解决方案。分享它希望对其他人有帮助：

为了抽屉导航（https://reactnavigation.org/docs/drawer-navigator）正常工作，我们需要执行以下操作：

(1) 使用以下命令安装导航抽屉：npm install @react-navigation/drawer。

（2）安装react-native-gesture-handler和react-native-reanimated：

     (a) For bare react-native: npm install react-native-gesture-handler react-native-reanimated
     (b) For expo projects: npx expo install react-native-gesture-handler react-native-reanimated

(3) 在我们的 babel.config.js 文件中添加重新激活的插件，如下代码所示：

module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: [
      'react-native-reanimated/plugin',
    ],
  };
};

(4) 最后使用 -c 标志启动项目以重新启动而不是从缓存中启动：expo start my-app -c

这对我有用。希望对你也有帮助