Fix the upstream dependency conflict installing NPM packages

Question

Trying to npm install vue-mapbox mapbox-gl and I'm getting a dependency tree error.

I'm running Nuxt SSR with Vuetify, and haven't installed anything related to Mapbox prior to running this install and getting this error.

38 error code ERESOLVE
39 error ERESOLVE unable to resolve dependency tree
40 error
41 error While resolving: [1mexample[22m@[1m1.0.0[22m
41 error Found: [1mmapbox-gl[22m@[1m1.13.0[22m[2m[22m
41 error [2mnode_modules/mapbox-gl[22m
41 error   [1mmapbox-gl[22m@"[1m^1.13.0[22m" from the root project
41 error
41 error Could not resolve dependency:
41 error [35mpeer[39m [1mmapbox-gl[22m@"[1m^0.53.0[22m" from [1mvue-mapbox[22m@[1m0.4.1[22m[2m[22m
41 error [2mnode_modules/vue-mapbox[22m
41 error   [1mvue-mapbox[22m@"[1m*[22m" from the root project
41 error
41 error Fix the upstream dependency conflict, or retry
41 error this command with --force, or --legacy-peer-deps
41 error to accept an incorrect (and potentially broken) dependency resolution.
41 error
41 error See /Users/user/.npm/eresolve-report.txt for a full report.
42 verbose exit 1

What's the right way to go about fixing this upstream dependency conflict?

Solution 1

Looks like it's a problem with Peer Dependencies in the latest version of npm (v7) which is still a beta version. try with npm install --legacy-peer-deps for detail info check this https://blog.npmjs.org/post/626173315965468672/npm-v7-series-beta-release-and-semver-major

Solution 2

Use --legacy-peer-deps after npm install. For example, if you want to install radium, use:

npm install --legacy-peer-deps --save radium

Solution 3

There are TWO ways:

1. use npm install --legacy-peer-deps to install, and if this doesn't work use

2. force method. add --force next to npm install: npm install --force

Solution 4

until npm version 7.19.1 still have same issue, after upgraded to version 7.20.3 use command npm install -g npm@latest and npm audit fix all pkgs fixed without error.

View more solutions

Comments

[Ali.Rashidi]

What is that flag?

[ggorlen]

npm: When to use --force and --legacy-peer-deps might be helpful

[Mihai Paraschivescu]

For me this answer worked the best (Node v16.14.0, npm v8.3.1, Angular 13.2.4). But I had to run it with the --force flag, like this npm audit fix --force. Thanks!

[Mihai Paraschivescu]

Actually when trying to build the project, this solution caused other build errors related to ng2-logger (tnp-core/browser, more exactly). So I had to fallback to npm install --legacy-peer-deps which actually made build work.