Ошибка: undefined Невозможно разрешить модуль `@ response-navigation/bottom-tabs`

Question

Искал решение по поводу модуля ошибок в навигации. Я пробовал сбросить кеш, удалить nodu_modules, переустановить модуль, но он все еще не работает.

Полная информация об ошибке

Unable to resolve module `@react-navigation/native` from `src/App.js`: @react-navigation/native could not be found within the project.

Package.json

"@react-native-community/masked-view": "^0.1.9",
    "native-base": "^2.13.12",
    "react": "16.9.0",
    "react-native": "0.61.5",
    "react-native-gesture-handler": "^1.6.1",
    "react-native-reanimated": "^1.8.0",
    "react-native-safe-area-context": "^0.7.3",
    "react-native-screens": "^2.4.0",
    "react-native-splash-screen": "^3.2.0",
    "react-native-vector-icons": "^6.6.0",
    "react-navigation-stack": "^2.3.11"

App.js

import * as React from 'react';
import { Text, View } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';

function HomeScreen() {
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>Home!</Text>
    </View>
  );
}

function SettingsScreen() {
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>Settings!</Text>
    </View>
  );
}

const Tab = createBottomTabNavigator();

export default function App() {
  return (
    <NavigationContainer>
      <Tab.Navigator>
        <Tab.Screen name="Home" component={HomeScreen} />
        <Tab.Screen name="Settings" component={SettingsScreen} />
      </Tab.Navigator>
    </NavigationContainer>
  );
}

Answer 1

В вашем package.json добавьте "@response-navigation/native": "^5.1.5", а затем запустите npm install @response-navigation/native

Answer 2

Пакет, который вы используете, является модульным. Итак, чтобы это работало, вам нужно установить определенные компоненты.

В вашем случае вам нужно запустить:

      yarn add @react-navigation/native
yarn add @react-navigation/bottom-tabs

Причина такого поведения в том, что во многих приложениях вам нужен только один тип навигации. Это будет означать, что вы устанавливаете неиспользуемый код и загромождаете свой пакет.

Чтобы очистить кеш сборщика, вы можете сделать что-то вроде этого:

npm <6,0 и RN <0,50:

       watchman watch-del-all && rm -rf $TMPDIR/react-* &&
 rm -rf node_modules/ && npm cache clean && npm install && 
 npm start -- --reset-cache

npm> = 6,0 и RN> = 0,50:

       watchman watch-del-all && rm -rf $TMPDIR/react-native-packager-cache-* &&
 rm -rf $TMPDIR/metro-bundler-cache-* && rm -rf node_modules/ && npm cache clean --force &&
 npm install && npm start -- --reset-cache

Это должно сработать.

Answer 3

Бегать:

      npm install @react-navigation/bottom-tabs --force

Это сработало для меня

Answer 4

Во-первых

      rm -rf node_modules/ && npm cache clean

Убедитесь, что у вас есть@react-navigation/nativeи его зависимости затем установите@react-navigation/bottom-tabs:

Зависимости:

      yarn add @react-navigation/native

В каталоге проекта, управляемого выставкой, запустите:

      npx expo install react-native-screens react-native-safe-area-context

(Или) В каталоге вашего голого проекта запустите:

      npm install react-native-screens react-native-safe-area-context

Затем

      yarn add @react-navigation/bottom-tabs

Answer 5

Думаю, вам нужно установить пакет. npm install @react-navigation/bottom-tabs

Answer 6

Попробуйте это «npm i @react-navigation/bottom-tabs»