In my case I forgot to add one line which is import 'react-native-gesture-handler'; on top of the file in index.js

if you don't install it so you have to install it first by using the command npm install react-native-gesture-handler

OR

yarn add react-native-gesture-handler

There have been few fixes on Github for this package issues on resolving the above dreadful error, which one of it happens to work for me. I'll highlight a couple of fixes here and follow the link for more.

Follow these steps to fix it, but I only tried the last part:

• delete node_modules and your lock file (package-lock.json / yarn.lock)
• change the expo package version in package.json to 38.0.8
• remove react-native-safe-area-context from your package.json
• run yarn or npm install

The below step works for me.

• run expo install react-native-safe-area-context

Thanks to brentvatne.

Invariant Violation: Tried to register two views with the same name RNCSafeAreaProvider error with @react-navigation/stack

It means you have installed same extension multiple times.

Running "npm dedupe" command solved my problem.

or Yarn install (The dedupe command isn’t necessary. yarn install will already dedupe.)

Even though its already answered I'll provide a solution that worked for me.

"react-native-safe-area-context" is probably causing a conflict with Navigation Container.

Removing "safe-area-context" solved the issue temporarily for me and its probably the way for a more permanent solution.

Im a React-Native beginner but this is my input to help other people with similar issues.

Just running

expo upgrade

solved my issue.

In the pack-lock.json file, remove the react-native-safe-area-context. That will solve the problem.

The code will look like this:

  "react-native-elements": {
      "version": "3.1.0",
      "resolved": "https://registry.npmjs.org/react-native-elements/-/react-native-elements-3.1.0.tgz",
      "integrity": "sha512-U4CuyO+q2JlduPht4P0xz+oIbw3W53uYPpkMqvlwjJiVoFfwnpbAu+JZL01/7VMe98G4Y8nJImcBh7zK9cb3Uw==",
      "requires": {
        "@types/react-native-vector-icons": "^6.4.6",
        "color": "^3.1.2",
        "deepmerge": "^4.2.2",
        "hoist-non-react-statics": "^3.3.2",
        "lodash.isequal": "^4.5.0",
        "opencollective-postinstall": "^2.0.3",
        "prop-types": "^15.7.2",
        "react-native-ratings": "^7.3.0",
        "react-native-safe-area-context": "^3.1.9",
        "react-native-size-matters": "^0.3.1"
      },
      "dependencies": {
        "deepmerge": {
          "version": "4.2.2",
          "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
          "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg=="
        },
        "opencollective-postinstall": {
          "version": "2.0.3",
          "resolved": "https://registry.npmjs.org/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz",
          "integrity": "sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q=="
        },
        ---> "react-native-safe-area-context": { <--- remove this
          "version": "3.1.9",
          "resolved": "https://registry.npmjs.org/react-native-safe-area-context/-/react-native-safe-area-context-3.1.9.tgz",
          "integrity": "sha512-wmcGbdyE/vBSL5IjDPReoJUEqxkZsywZw5gPwsVUV1NBpw5eTIdnL6Y0uNKHE25Z661moxPHQz6kwAkYQyorxA=="
        }
      }
    },

package.json adding in scripts npm dedupe worked for me .

For me it worked using the commands:

npm dedupe
expo update

Okay, this might seem a little wacky hacky, and I'm not quite sure how or why it worked, but it did. I tried pretty much all the answers here and got nowhere.

Note: I had ./package.json in my directory already from when my app previously threw this error, see below

For some reason, if do the following:

1. I run Yarn, allow it to create ./yarn.lock and ./node_modules
2. THEN I run npm i which creates the ./package-lock.json file
3. Run expo start, my app loads...

I don't think this is good practice but it worked for me. Here's my ./package.json which I had in my directory BEFORE I ran yarn/went through the steps in the order above:

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "@babel/runtime": "7.0.0-beta.55",
    "@react-native-async-storage/async-storage": "^1.15.9",
    "@react-native-community/netinfo": "6.0.0",
    "@react-navigation/bottom-tabs": "^6.0.5",
    "@react-navigation/drawer": "^6.1.4",
    "@react-navigation/native": "^6.0.2",
    "aws-amplify": "^4.2.5",
    "aws-amplify-react-native": "^5.0.3",
    "expo": "~42.0.1",
    "expo-status-bar": "~1.0.4",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-42.0.0.tar.gz",
    "react-native-gesture-handler": "~1.10.2",
    "react-native-reanimated": "~2.2.0",
    "react-native-safe-area-context": "3.2.0",
    "react-native-screens": "~3.4.0",
    "react-native-web": "~0.13.12"
  },
  "devDependencies": {
    "@babel/core": "~7.9.0"
  },
  "private": true
}

If it works for anyone that visits, cool, if someone could explain or attempt to repeat this and comes up with an explanation please share.

1. Run expo install react-native-safe-area-context
2. Run yarn install or npm install

it works for me version sdk(42.0.0) ❤️❤️❤️🥳🥳😉

here is the solution :)

open your app route folder ==> node_modules ==> invariant ==> browser.js

in browser.js file remove the [if condition code] (line number 28 to 46 )

my package.json file given below :

"expo": "~42.0.1",

"react": "16.13.1",

"react-native": "https://github.com/expo/react-native/archive/sdk-42.0.0.tar.gz",

"react-native-safe-area-context": "3.1.9",

reinstalling react-native-safe-area-context did the trick for me in EXPO.

What worked for me was uninstalling react-native-elements and reinstalling them.

react-native-safe-area-context has a module inside of react-native-elements, which caused caused the duplicate error.

The other answers worked only temporarily but the error would continue to appear

it works for me version SDK(42.0.0)

here is the solution :)

open your app route folder ==> node_modules ==> invariant ==> browser.js

in browser.js file remove the [if condition code] (line number 28 to 46 )

my package.json file given below :

"expo": "~42.0.1",

"react": "16.13.1",

 "react-native": "https://github.com/expo/react-native/archive/sdk-42.0.0.tar.gz",

"react-native-safe-area-context": "^3.3.0",
"react-native-screens": "^3.5.0",

is here is the solution

Comented the line

open your app route folder ==> node_modules ==> invariant ==> browser.js

in browser.js file remove the [if condition code] (line number 28 to 46 )

For my case, two different masked-view packages in package.json caused it:

"@react-native-community/masked-view": "0.1.10",
"@react-native-masked-view/masked-view": "0.2.4",

ReactNavigation5 requires @react-native-community/masked-view, while react-native-skeleton-placeholder has the other as the prerequisite. So, watching your dependencies, you can remove one of those to get rid of this error.