无法解决反应导航/核心

Question

我正在尝试构建一个带有一些导航的 React Native 应用程序，但每当我构建它时都会出现此错误，我正在使用 expo 来构建应用程序：

Android Bundling failed 6098ms
While trying to resolve module `@react-navigation/core` from file `/Users/laurent/Documents/Delivery/Tek3/DEV/B-DEV-501-LYN-5-1-redditech-laurent.cazette/node_modules/@react-navigation/native/src/ResourceSavingSceneView.js`, the package `/Users/laurent/Documents/Delivery/Tek3/DEV/B-DEV-501-LYN-5-1-redditech-laurent.cazette/node_modules/@react-navigation/core/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`/Users/laurent/Documents/Delivery/Tek3/DEV/B-DEV-501-LYN-5-1-redditech-laurent.cazette/node_modules/@react-navigation/core/lib/module/index.js`. Indeed, none of these files exist:

  * /Users/laurent/Documents/Delivery/Tek3/DEV/B-DEV-501-LYN-5-1-redditech-laurent.cazette/node_modules/@react-navigation/core/lib/module/index.js(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
  * /Users/laurent/Documents/Delivery/Tek3/DEV/B-DEV-501-LYN-5-1-redditech-laurent.cazette/node_modules/@react-navigation/core/lib/module/index.js/index(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)

我想我已经安装了所有依赖项，但这是我的 package.json 以防我忘记了任何东西：

{
  "main": "index.js",
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "web": "expo start --web",
    "start": "react-native start"
  },
  "dependencies": {
    "@react-native-community/masked-view": "^0.1.11",
    "@react-navigation/core": "react-navigation/core",
    "@react-navigation/native": "react-navigation/native",
    "@react-navigation/stack": "5.9.0",
    "expo": "~42.0.1",
    "expo-splash-screen": "~0.11.2",
    "expo-status-bar": "~1.0.4",
    "expo-updates": "~0.8.1",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "0.63.4",
    "react-native-gesture-handler": "~1.10.2",
    "react-native-paper": "^4.9.2",
    "react-native-reanimated": "~2.2.0",
    "react-native-safe-area-context": "^3.3.2",
    "react-native-screens": "~3.4.0",
    "react-native-svg": "^12.1.1",
    "react-native-unimodules": "0.14.10",
    "react-native-vector-icons": "^8.1.0",
    "react-native-web": "^0.17.5",
    "react-navigation": "^4.4.4",
    "react-navigation-stack": "^2.10.4",
    "styled-components": "^5.3.1",
    "styled-system": "^5.1.5"
  },
  "devDependencies": {
    "@babel/core": "^7.9.0"
  },
  "private": true
}

我已经尝试更新 metro.config.js ：

const { getDefaultConfig } = require('expo/metro-config');

module.exports = {
    resolver: {
      /* resolver options */
      sourceExts: ['jsx', 'js', 'ts', 'tsx'],
    },
    maxWorkers: 2,
    transformer: {
      getTransformOptions: async () => ({
        transform: {
          experimentalImportSupport: false,
          inlineRequires: false,
        },
      }),
    },
  };
module.exports = getDefaultConfig(__dirname);

你们有什么想法吗？

Answer 1

试试这个：

1. 安装 react-navigation 模块。
2. 重新构建您的项目。
3. 通过停止当前的打包程序重新启动打包程序 打包器，然后使用 react-native 再次启动打包器 开始。

Unable to resolve module 'react-navigation'

Answer 2

你为什么会这样？

"@react-navigation/core": "react-navigation/core",
"@react-navigation/native": "react-navigation/native",

它们必须是正确的版本号。按照官网文档安装包：

https://reactnavigation.org/docs/getting-started

https://reactnavigation.org/docs/stack-navigator/

expo install react-native-screens react-native-safe-area-context react-native-gesture-handler
yarn add @react-navigation/native @react-navigation/stack

并从您的package.json 中删除"@react-navigation/core": "react-navigation/core"。