How to handle conflicting peer dependencies? - npm

Question

As a devDependency I have installed "#typescript-eslint/parser": "~4.31.2"
Running npm install tells me, that a package needs 4.20.0 and another one 4.28.3 - if I understand the error correctly.
How do I handle these npm package conflicts?
npm ERR! While resolving: #nrwl/eslint-plugin-nx#12.9.0
npm ERR! Found: #typescript-eslint/parser#4.31.2
npm ERR! node_modules/#typescript-eslint/parser
npm ERR! dev #typescript-eslint/parser#"~4.31.2" from the root project
npm ERR! #typescript-eslint/parser#"^4.20.0" from eslint-config-next#11.1.2
npm ERR! node_modules/eslint-config-next
npm ERR! dev eslint-config-next#"11.1.2" from the root project
npm ERR! eslint-config-next#"^11.1.0" from #nrwl/next#12.9.0
npm ERR! node_modules/#nrwl/next
npm ERR! dev #nrwl/next#"12.9.0" from the root project
npm ERR! 1 more (#typescript-eslint/eslint-plugin)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer #typescript-eslint/parser#"~4.28.3" from #nrwl/eslint-plugin-nx#12.9.0
npm ERR! node_modules/#nrwl/eslint-plugin-nx
npm ERR! dev #nrwl/eslint-plugin-nx#"12.9.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: #typescript-eslint/parser#4.28.5
npm ERR! node_modules/#typescript-eslint/parser
npm ERR! peer #typescript-eslint/parser#"~4.28.3" from #nrwl/eslint-plugin-nx#12.9.0
npm ERR! node_modules/#nrwl/eslint-plugin-nx
npm ERR! dev #nrwl/eslint-plugin-nx#"12.9.0" from the root project

Answer 1

You are using npm 7.x, which is more strict about peer dependencies than npm 6.x. The easiest solution is to run npm install with the --legacy-peer-deps flag. In theory, that may result in some incompatibility issues with peer dependencies. In practice, a lot of people do it anyway. And a lot of people are running npm 6.x and that is the default behavior there, so a lot of people are doing it perhaps without even realizing it.
In your case, #nrwl/eslint-plugin-nx#12.9.0 says that it requires #typescript-eslint/parser#4.28.x and you are installing #typescript-eslint/parser#4.31.2. So if you don't want to use npm 6.x or the --legacy-peer-deps solution, another possibility is to install #typescript-eslint/parser#4.28.5 instead of 4.31.2.
Another thing you can do is open a pull request to update #nrwl/eslint-plugin-nx to use ^ in the relevant peerDependencies entry instead of ~. That will allow 4.x for the peer dependency, rather than limiting it to 4.28.x. It's possible they limited it so severely on purpose, but probably not. (I went to look, but there are hundreds of issues opened in that repository so I didn't spend time looking through them.)

Answer 2

Encountered similar errors when running an Azure DevOps build pipeline (which hadn't changed) against source code that also hadn't changed.
Adding the -g npm-reinstall option to the npm install step resolved the issue.
npm install -g npm-reinstall

Answer 3

While using nx monorepo the solution was to run nx migrate 'package'
e.g.
nx migrate #typescript-eslint/parser