npm install fails with Conflicting peer dependency: react#16.14.0 - node.js

Question

while trying to install dependencies for this project, npm install fails with
> npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: ecommerce-app#0.1.0
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! react#"latest" from the root project
npm ERR! peer react#"^16.8.0 || ^17.0.0" from #material-ui/core#4.11.4
npm ERR! node_modules/#material-ui/core
npm ERR! #material-ui/core#"latest" from the root project
npm ERR! peer #material-ui/core#"^4.0.0" from #material-ui/icons#4.11.2
npm ERR! node_modules/#material-ui/icons
npm ERR! #material-ui/icons#"latest" from the root project
npm ERR! 1 more (#material-ui/lab)
npm ERR! 10 more (react-dom, #material-ui/icons, #material-ui/lab, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! redux-form#"^8.3.6" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react#16.14.0
npm ERR! node_modules/react
npm ERR! peer react#"^16.4.2" from redux-form#8.3.7
npm ERR! node_modules/redux-form
npm ERR! redux-form#"^8.3.6" 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.
npm ERR!
npm ERR! See /Users/gergo/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/gergo/.npm/_logs/2022-03-17T17_37_09_399Z-debug-0.log
EDIT
when running npm install --force, I got this other error
npm ERR! 2 warnings generated.
npm ERR! In file included from ../src/libsass/src/values.cpp:3:
npm ERR! In file included from ../src/libsass/src/values.hpp:4:
npm ERR! ../src/libsass/src/ast.hpp:1614:25: warning: loop variable 'numerator' of type 'const std::__1::basic_string<char>' creates a copy from type 'const std::__1::basic_string<char>' [-Wrange-loop-analysis]
npm ERR! for (const auto numerator : numerators)
npm ERR! ^
npm ERR! ../src/libsass/src/ast.hpp:1614:14: note: use reference type 'const std::__1::basic_string<char> &' to prevent copying
npm ERR! for (const auto numerator : numerators)
npm ERR! ^~~~~~~~~~~~~~~~~~~~~~
npm ERR! &
npm ERR! ../src/libsass/src/ast.hpp:1616:25: warning: loop variable 'denominator' of type 'const std::__1::basic_string<char>' creates a copy from type 'const std::__1::basic_string<char>' [-Wrange-loop-analysis]
npm ERR! for (const auto denominator : denominators)
npm ERR! ^
npm ERR! ../src/libsass/src/ast.hpp:1616:14: note: use reference type 'const std::__1::basic_string<char> &' to prevent copying
npm ERR! for (const auto denominator : denominators)
npm ERR! ^~~~~~~~~~~~~~~~~~~~~~~~
npm ERR! &
npm ERR! 2 warnings generated.
npm ERR! In file included from ../src/binding.cpp:1:
npm ERR! In file included from ../../nan/nan.h:56:
npm ERR! In file included from /Users/gergo/.node-gyp/17.4.0/include/node/node.h:63:
npm ERR! In file included from /Users/gergo/.node-gyp/17.4.0/include/node/v8.h:25:
npm ERR! In file included from /Users/gergo/.node-gyp/17.4.0/include/node/v8-array-buffer.h:12:
npm ERR! In file included from /Users/gergo/.node-gyp/17.4.0/include/node/v8-local-handle.h:12:
npm ERR! /Users/gergo/.node-gyp/17.4.0/include/node/v8-internal.h:563:38: error: no template named 'remove_cv_t' in namespace 'std'; did you mean 'remove_cv'?
npm ERR! !std::is_same<Data, std::remove_cv_t<T>>::value>::Perform(data);
npm ERR! ~~~~~^~~~~~~~~~~
npm ERR! remove_cv
npm ERR! /Library/Developer/CommandLineTools/usr/bin/../include/c++/v1/type_traits:697:50: note: 'remove_cv' declared here
npm ERR! template <class _Tp> struct _LIBCPP_TEMPLATE_VIS remove_cv
npm ERR! ^
npm ERR! 1 error generated.
npm ERR! make: *** [Release/obj.target/binding/src/binding.o] Error 1
npm ERR! gyp ERR! build error
npm ERR! gyp ERR! stack Error: `make` failed with exit code: 2
npm ERR! gyp ERR! stack at ChildProcess.onExit (/Users/gergo/Documents/spring-boot-react-ecommerce-app/client/node_modules/node-gyp/lib/build.js:262:23)
npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:520:28)
npm ERR! gyp ERR! stack at Process.ChildProcess._handle.onexit (node:internal/child_process:291:12)
npm ERR! gyp ERR! System Darwin 19.6.0
npm ERR! gyp ERR! command "/usr/local/Cellar/node/17.4.0/bin/node" "/Users/gergo/Documents/spring-boot-react-ecommerce-app/client/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd /Users/gergo/Documents/spring-boot-react-ecommerce-app/client/node_modules/node-sass
npm ERR! gyp ERR! node -v v17.4.0
npm ERR! gyp ERR! node-gyp -v v3.8.0
npm ERR! gyp ERR! not ok
npm ERR! Build failed with error code: 1
EDIT
the second error is thrown while installing node-sass. my node version was not compatible with "node-sass": "^4.14.1". I have changed node-sass version to be compatible with my node version and this error went away. and the build is successful

Answer 1

For first error I tried to install npm by below 2 command in Terminal one after another. It fixes for me:
npm install --legacy-peer-deps
npm audit fix --force`
*N.B: Don't forget to restart terminal after installing

Answer 2

You are getting errors because of the #material-ui/core which is deprecated see: https://www.npmjs.com/package/#material-ui/core
the new package for material-ui is https://www.npmjs.com/package/#mui/material.
As they say here https://mui.com/guides/migration-v4/#update-react-amp-typescript-version
The minimum supported version of React was increased from v16.8.0 to v17.0.0.
You should consider upgrading your react and material ui, they also changed styling tool to emotion, you'll find more info about in the link above.
Also, they have pretty good migration guides for cases like yours, check https://mui.com/components/data-grid/migration-v4/#migrating-mui-core-from-v4
Temporary alternative can be using force install(npm install --force) but I really recommend upgrading your dependencies as otherwise there are no warranties that things will work.

Answer 3

install the dependencies like this:
npm install <dependencyname> --force
or if you want to install all dependencies at once,
npm install --force

Answer 4

the second error is thrown while installing node-sass.
my node version (17.4) was not compatible with "node-sass": "^4.14.1"
I have changed node-sass version to be compatible with my node version and this error went away. and the build is successful.

Answer 5

Is it still failing? for me npm install works without an error using node version 14.16.0

Answer 6

You need to upgrade your node-sass version to be compatible with the current LTS version of Node.js.
To do this, change your package.json file to include the following (replacing the old declaration).
{
"dependencies": {
"node-sass": "^7.0.1"
}
}
Then, run the following command, and there should be no errors.
$ npm install
Ignore the $, it is just to indicate the terminal.

Answer 7

Try changing package management to yarn. At present, most packages already support yarn, and its dependency processing is better.
yarn install

Answer 8

Tried all the above solutions but when I Removed all the dependencies and install them one by one, It worked.