I am trying to install the library #material-ui/pickers by running:
npm i #material-ui/pickers
But this error shows up:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: five#0.1.0
npm ERR! Found: react#17.0.1
npm ERR! node_modules/react
npm ERR! react#"^17.0.1" from the root project
npm ERR! peer react#"^16.8.0 || ^17.0.0" from #material-ui/core#4.11.3
npm ERR! node_modules/#material-ui/core
npm ERR! #material-ui/core#"^4.11.3" from the root project
npm ERR! peer #material-ui/core#"^4.0.0" from #material-ui/pickers#3.2.10
npm ERR! node_modules/#material-ui/pickers
npm ERR! #material-ui/pickers#"*" from the root project
npm ERR! 1 more (react-dom)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16.8.4" from #material-ui/pickers#3.2.10
npm ERR! node_modules/#material-ui/pickers
npm ERR! #material-ui/pickers#"*" 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.
Here are my package.json dependencies:
"dependencies": {
"#material-ui/core": "^4.11.3",
"#testing-library/jest-dom": "^5.11.9",
"#testing-library/react": "^11.2.3",
"#testing-library/user-event": "^12.6.2",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-scripts": "4.0.1",
"web-vitals": "^0.2.4"
},
I thought there was maybe some problems in other parts of my file, so I started a create-react-app from scratch and tried again, but the same error is still occuring.
Perhaps you want to check out the new Material UI DatePicker from over here. If I understood correctly#material-ui/pickers isn't used anymore.
#material-ui/pickers required react to be 16.13.1 or higher but not to 17.xx.xx. Right now you are using React version 17.0.1. You can try to downgrade the React to version 16 and see if it works
I even had this error and what I did was simply closed my VScode because the project was open in it and again tried to install the package and guess what it works. You can try this solution hopefully it works.
Related
I'm following an e-commerce tutorial, cannot install all the packages react-paypal button in npm with react 18
npm i react-paypal-smart-button
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
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 C:\Users\a\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\a\AppData\Local\npm-cache\_logs\2023-02-09T15_12_52_013Z-debug-0.log
react-paypal-smart-button has peerDeps like that:
"peerDependencies": {
"prop-types": "^15.6.0",
"react": "^17.0.2",
"react-dom": "^17.0.2"
},
And you installed react version 18.
So just use flag npm i--legacy-peer-deps to ignore that warning. (then react-paypal-smart-button will use your react 18 instead of recommended 17. Hope that will not break the package:))
About peerDeps - https://nodejs.org/es/blog/npm/peer-dependencies/
I had been attempting to update dependencies on an old project recently. Within my package.json file - I outline my npm and node version, as well as the dependencies I'm using:
"engines": {
"npm": "9.x",
"node": "14.x"
},
"dependencies": {
"isomorphic-fetch": "^3.0.0",
"jquery": "^3.3.1",
"react": "^16.5.2",
"react-dom": "^16.5.2",
"react-google-charts": "^1.6.6",
"react-scripts": "^2.1.3",
"react-select": "^1.3.0",
"react-toggle-display": "^2.2.0",
"react-tooltip": "^3.8.4",
"react-transition-group": "^4.4.5",
"survey-react": "^0.12.36"
}
When I run npm install; however, I'm met with a litany of errors regarding the packages I'm using.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: react-transition-group#4.4.5
npm ERR! Found: react#16.5.2
npm ERR! node_modules/react
npm ERR! react#"^16.5.2" from the root project
npm ERR! peer react#"^16.0.0" from react-dom#16.5.2
npm ERR! node_modules/react-dom
npm ERR! react-dom#"^16.5.2" from the root project
npm ERR! peer react-dom#">=15.0.0" from react-google-charts#1.6.6
npm ERR! node_modules/react-google-charts
npm ERR! react-google-charts#"^1.6.6" from the root project
npm ERR! 2 more (react-select, react-tooltip)
npm ERR! 4 more (react-google-charts, react-input-autosize, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#">=16.6.0" from react-transition-group#4.4.5
npm ERR! node_modules/react-transition-group
npm ERR! react-transition-group#"^4.4.5" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react#18.2.0
npm ERR! node_modules/react
npm ERR! peer react#">=16.6.0" from react-transition-group#4.4.5
npm ERR! node_modules/react-transition-group
npm ERR! react-transition-group#"^4.4.5" from the root project
I'm unsure what steps I should take to resolve this. Is this an issue with the version of react I'm currently using?
I have a react app created with cra. I want to install webpack in order to setup module federation.
I am getting this error on running the below command:
$ npm i --D webpack#5.24.0 webpack-cli webpack-server html-webpack-plugin babel-loader webpack-dev-server
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: netlify-foot#0.1.0
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! react#"^17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"~0.9" from webpack-server#0.1.2
npm ERR! node_modules/webpack-server
npm ERR! dev webpack-server#"*" 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 C:\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\AppData\Local\npm-cache\_logs\2021-06-05T15_25_05_470Z-debug.log
package.json
{
"dependencies": {
"#testing-library/jest-dom": "^5.12.0",
"#testing-library/react": "^11.2.7",
"#testing-library/user-event": "^12.8.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-scripts": "4.0.3",
"web-vitals": "^1.1.2"
}
}
What is the issue? How to get this working?
Your install command is:
npm i --D webpack#5.24.0 webpack-cli webpack-server html-webpack-plugin babel-loader webpack-dev-server
This means, it tries to add the following six packages:
webpack#5.24.0
webpack-cli
webpack-server
html-webpack-plugin
babel-loader
webpack-dev-server
But webpack-server is not a thing. Remove it.
If you look closely at your error message, it kinda tries to tell you the same thing:
npm ERR! Could not resolve dependency:
npm ERR! peer react#"~0.9" from webpack-server#0.1.2
It says that it fails to satisfy dependencies caused by this webpack-server. Make sure to get rid of it. That will at least fix this problem.
Your next problem
NOTE however, that for further customization of CRA's webpack build, given you don't want to eject, you also need a way to override it's default build settings.
For that, you might want to check out CRACO.
CRACO (like Webpack Module Federation) does not have very good documentation, but it has a few webpack-related examples here.
This question already has answers here:
What does npm install --legacy-peer-deps do exactly? When is it recommended / What's a potential use case?
(7 answers)
Closed 1 year ago.
I am getting the following error while updating from React 17.0.1 to 17.0.2.
It's not entirely clear to me why the dependencies are causing problems.
I'm using npm v 7.4.
It seems that some dependencies are incompatible with react 17. Do I understand correctly?
But npm shows e. g.
npm ERR! peer react-dom#"^15.0.0 || ^16.0.0 || ^17.0.0" from react-calendly#2.0.0
npm ERR! node_modules/react-calendly
If I think correct, React 17 should work.
Could someone explain the problem to me briefly? Is there a solution for this?
Error:
npm install --save react#17.0.2
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! react#"17.0.2" from the root project
npm ERR! peer react#"^0.14.0 || ^15.0.0 || ^16.0.0 || ^17.0.0" from mini-create-react-context#0.4.1
npm ERR! node_modules/mini-create-react-context
npm ERR! mini-create-react-context#"^0.4.0" from react-router#5.2.0
npm ERR! node_modules/react-router
npm ERR! react-router#"5.2.0" from react-router-dom#5.2.0
npm ERR! node_modules/react-router-dom
npm ERR! react-router-dom#"^5.2.0" from the root project
npm ERR! 7 more (react-calendly, react-icons, react-router, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"17.0.1" from react-dom#17.0.1
npm ERR! node_modules/react-dom
npm ERR! peer react-dom#"^15.0.0 || ^16.0.0 || ^17.0.0" from react-calendly#2.0.0
npm ERR! node_modules/react-calendly
npm ERR! react-calendly#"^2.0.0" from the root project
npm ERR! peer react-dom#"^15.5.4 || ^16.0.0 || ^17.0.0" from react-scroll#1.8.2
npm ERR! node_modules/react-scroll
npm ERR! react-scroll#"^1.8.2" from the root project
npm ERR! 2 more (styled-components, 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!
My dependencies:
"emailjs-com": "^2.6.4",
"react": "^17.0.1",
"react-calendly": "^2.0.0",
"react-dom": "^17.0.1",
"react-icons": "^4.2.0",
"react-router-dom": "^5.2.0",
"react-router-scroll-top": "^0.2.1",
"react-scripts": "^4.0.3",
"react-scroll": "^1.8.2",
"styled-components": "^5.3.0",
"swiper": "^6.5.0"
I don't understand, why 17.0.0 should be working, but 17.0.2 not.
Thanks for your help.
You have dependency conflict which will create this problem.
I suggest solve using --force or --legacy-peer-deps.
So try :
npm install --save react#17.0.2 --force
OR
npm install --save react#17.0.2 --legacy-peer-deps
Reason of problem :
There is dependency conflict which means dependency not compatible with other or something similar which will create this problem.
I was following Gatsbyjs tutorial. (https://www.gatsbyjs.com/docs/tutorial/part-four/) Link here.
I typed the command in window terminal,
gatsby new tutorial-part-four https://github.com/gatsbyjs/gatsby-starter-hello-world
cd tutorial-part-four
npm install gatsby-plugin-typography typography react-typography typography-theme-kirkham gatsby-plugin-emotion #emotion/react
But error has occurred with these messages,
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: gatsby-starter-hello-world#0.1.0
npm ERR! Found: react#17.0.1
npm ERR! node_modules/react
npm ERR! react#"^17.0.1" from the root project
npm ERR! peer react#"^16.9.0 || ^17.0.0" from gatsby-plugin-typography#3.0.0
npm ERR! node_modules/gatsby-plugin-typography
npm ERR! gatsby-plugin-typography#"*" from the root project
npm ERR! 2 more (gatsby, react-dom)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^0.14.0 || ^15.0.0 || ^16.0.0" from react-typography#0.16.19
npm ERR! node_modules/react-typography
npm ERR! peer react-typography#"^0.16.1 || ^1.0.0-alpha.0" from gatsby-plugin-typography#3.0.0
npm ERR! node_modules/gatsby-plugin-typography
npm ERR! gatsby-plugin-typography#"*" 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 C:\Users\pc\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\pc\AppData\Local\npm-cache\_logs\2021-03-13T09_43_09_116Z-debug.log
I want to know how to solve these error?
react-typography isn't ready for react 17, so you'll have to downgrade react into version 16 to use it.
Edit package.json and look for:
"dependencies": {
...
"react": "^17.0.1",
"react-dom": "^17.0.1",
...
},
change the version numbers to 16.14.0
"dependencies": {
...
"react": "^16.14.0",
"react-dom": "^16.14.0",
...
},
Save it and then remove all the files from node_modules/
rm -Rf node_modules
Finally, just reinstall everything using the command:
npm install
Continue with your command...
npm install gatsby-plugin-typography typography react-typography typography-theme-kirkham gatsby-plugin-emotion #emotion/react
I think the error is coming from npm versions
Try with adding --legacy-peer-deps option in npm install command
npm install gatsby-plugin-typography typography react-typography typography-theme-kirkham gatsby-plugin-emotion #emotion/react --legacy-peer-deps
or try after cleaning the npm by using below command
npm cache clean --force