Fix the upstream dependency conflict, React Native Expo

Question

I have a React Native Expo application, and I am trying to install expo-splash-screen with running npx expo install expo-splash-screen

As a result I get the following error message:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: react-navigation-drawer@2.7.2
npm ERR! Found: react-native-gesture-handler@2.5.0
npm ERR! node_modules/react-native-gesture-handler
npm ERR!   peer react-native-gesture-handler@">= 1.0.0" from @react-navigation/drawer@6.5.0
npm ERR!   node_modules/@react-navigation/drawer
npm ERR!     @react-navigation/drawer@"^6.5.0" from the root project
npm ERR!   peer react-native-gesture-handler@">= 1.5.0" from react-navigation-stack@2.10.4
npm ERR!   node_modules/react-navigation-stack
npm ERR!     react-navigation-stack@"^2.10.4" from the root project
npm ERR!   1 more (the root project)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native-gesture-handler@"^1.0.12" from react-navigation-drawer@2.7.2
npm ERR! node_modules/react-navigation-drawer
npm ERR!   react-navigation-drawer@"^2.7.2" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react-native-gesture-handler@1.10.3
npm ERR! node_modules/react-native-gesture-handler
npm ERR!   peer react-native-gesture-handler@"^1.0.12" from react-navigation-drawer@2.7.2
npm ERR!   node_modules/react-navigation-drawer
npm ERR!     react-navigation-drawer@"^2.7.2" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

While running npm -v react-native-gessture-handler it says: 8.15.0.

I have also tried using npm i react-native-splash-screen --force but it is not good for an expo application, and I am pretty sure that installing react-navigation-drawer with --force resulted the problem.

I am not really experienced with package managing so I do not really get the point of the error message. How can I install expo-splash-screen, and can somebody explain the error message?

score 0 · Answer 1 · answered Dec 03 '22 at 14:01

It looks you have libraries that use different versions of react-native-gesture-handler. react-navigation-drawer is using and older react-native-gesture-handler version and this package is deprecated so you cannot update it to use a higher version of react-native-gesture-handler.

The best solution in my opinion is to change the package react-navigation-drawer to @react-navigation/drawer as it says in the documentation of the package.

The other alternative but at your own risk is to specify in the package.json a resolution with the react-native-gesture-handler you need in expo-splash-screen and every library that have as peer dependecy react-native-gesture-handler will use this specific version.

  "resolutions": {
    "react-native-gesture-handler": "x.x.x"
  }

Let me know if it helps

Can you explain to a relative noob what you mean by change: "react-navigation-drawer to @react-navigation/drawer"? Where is this change made, and why would an ampersand at the start make a difference? — Reddspark, Apr 02 '23 at 09:33

Fix the upstream dependency conflict, React Native Expo

1 Answers1