title: However, this package itself specifies a `main` module field that could not be resolved
body: <p>I am new to react-native but not ReactJs iam going to mad about this error from 2 days</p>
  
  <pre><code>error: bundling failed: Error: While trying to resolve module `@react-navigation/native` from file `C:\XXXXX\Example\src\Router.jsx`, the package `C:\XXXXX\Example\node_modules\@react-navigation\native\package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`C:\XXXXX\Example\node_modules\@react-navigation\native\src\index.tsx`. Indeed, none of these files exist:
  
  error: bundling failed: Error: While trying to resolve module `react-native-safe-area-context` from file `C:\XXXXX\Example\App.js`, the package `C:\XXXXX\Example\node_modules\react-native-safe-area-context\package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`C:\XXXXX\Example\node_modules\react-native-safe-area-context\src\index.tsx`. Indeed, none of these files exist:
  </code></pre>
  
  <p>This is my package.json </p>
  
  <pre><code>{
    "name": "Example",
    "version": "0.0.1",
    "private": true,
    "scripts": {
      "start": "react-native start",
      "test": "jest"
    },
    "dependencies": {
      "@react-native-community/masked-view": "^0.1.6",
      "@react-navigation/native": "^5.0.0",
      "@react-navigation/stack": "^5.0.0",
      "eslint": "^6.8.0",
      "jetifier": "^1.6.5",
      "native-base": "^2.13.8",
      "prop-types": "^15.7.2",
      "react": "16.8.6",
      "react-native": "0.60.0",
      "react-native-camera": "^3.16.0",
      "react-native-gesture-handler": "^1.5.6",
      "react-native-image-crop-picker": "^0.28.0",
      "react-native-reanimated": "^1.7.0",
      "react-native-safe-area-context": "^0.7.2",
      "react-native-safe-area-view": "^1.0.0",
      "react-native-screens": "^2.0.0-beta.2",
      "react-native-svg": "^11.0.1",
      "react-native-vector-icons": "^6.6.0"
    },
    "devDependencies": {
      "@babel/core": "^7.3.3",
      "@babel/runtime": "^7.3.1",
      "@react-native-community/eslint-config": "^0.0.3",
      "babel-jest": "^24.1.0",
      "jest": "^24.1.0",
      "metro-react-native-babel-preset": "^0.54.1",
      "react-test-renderer": "16.8.6"
    },
    "jest": {
      "preset": "react-native"
    }
  }
  </code></pre>
  
  <p>I am downgrade the react-navigation version  to react-navigation 4 and react-navigation-stack
  the error become</p>
  
  <pre><code>error: bundling failed: Error: While trying to resolve module `react-native-safe-area-context` from file `C:\XXXXX\Example\node_modules\react-navigation-stack\lib\module\vendor\views\Stack\StackView.js`, the package `C:\XXXXX\Example\node_modules\react-native-safe-area-context\package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`C:\XXXXX\Example\node_modules\react-native-safe-area-context\src\index.tsx`. Indeed, none of these files exist:
  </code></pre>
  
  <p>I am also deleted node_modules ,clear cache and install again but no use same errors appear</p>