安装react原生复活和react导航抽屉

Question

我正在尝试安装一个react导航抽屉。在DOC指令上安装react native重新激活的第一个和我安装的。然后我安装了抽屉，得到了一个错误

npm ERR！代码ERESOLVEnpm ERR！ERESOLVE无法解析依赖关系树npm ERR！npm ERR！解决时：app_mobile@0.0.1npm ERR！找到：react-native-reanimated@2.3.0-beta.3npm ERR！node_modules/areact原生重新激活npm ERR！react native reactivated@"^2.3.0-β2"；从根项目npm ERR！npm ERR！无法解析依赖项：npm ERR！peer react native reactivated@">=1.0.0"；来自@react导航/drawer@6.1.8npm ERR！node_modules/@react导航/抽屉npm ERR@反应导航/抽屉@"*"从根项目npm ERR！npm ERR！修复上游依赖关系冲突，或重试npm ERR！该命令带有--force或--legacy peer depsnpm ERR！接受不正确的(并且可能已损坏的)依赖关系解析。npm ERR！npm ERR！有关完整报告，请参阅C:\Users\dell\AppData\Local\npm cache\eresolve-report.txt。npm ERR！此运行的完整日志可在以下位置找到：npm ERR！C： \Users\dell\AppData\Local\npm-cache_logs\2021-10-21T08_17_02_306Z-debug.log''

Answer 1

不能使用react-native-reanimatedv2.x如果使用react-navigationv6，则需要安装react-native-reanimatedv1.x

# remove the library
npm remove react-native-reanimated
# install 1.x
npm i react-native-reanimated@1.x

您可以从这里看到Drawer的对等依赖关系：https://github.com/react-navigation/react-navigation/blob/e77a5ab9d342a03cd8e20b54938700dfd4e23f42/packages/drawer/package.json#L68

Answer 2

通过在版本to中使用React导航抽屉，您可以确保已将useLegacyImplementation启用为true让我向您展示如何通过编码来实现它

import React, { Component } from 'react'
import { createDrawerNavigator } from '@react-navigation/drawer';
import { NavigationContainer } from "@react-navigation/native";
import Main from './Screens/Main';

const Drawer = createDrawerNavigator();

export default function MyDrawer() {
return (
<NavigationContainer>
<Drawer.Navigator  useLegacyImplementation={true} initialRouteName="Main">
<Drawer.Screen name="Main" component={Main} />
</Drawer.Navigator>
</NavigationContainer>
);
}

然后在babel.config.js 中添加插件

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