npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: aid-frontend#0.1.0
npm ERR! Found: react#16.14.0
npm ERR! node_modules/react
npm ERR! react#"^16.8.6" from the root project
npm ERR! peer react#">=16.8.6" from #chakra-ui/checkbox#1.7.1
npm ERR! node_modules/#chakra-ui/checkbox
npm ERR! #chakra-ui/checkbox#"^1.0.0" from the root project
npm ERR! 2 more (#emotion/react, #emotion/styled)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#">=18" from #chakra-ui/system#2.3.0
npm ERR! node_modules/#chakra-ui/system
npm ERR! peer #chakra-ui/system#">=1.0.0" from #chakra-ui/checkbox#1.7.1
npm ERR! node_modules/#chakra-ui/checkbox
npm ERR! #chakra-ui/checkbox#"^1.0.0" 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 /home/timjini/.npm/eresolve-report.txt for a full report.
I have tried so many diffent ways to solve this issue but it still persists
My dependencies
"dependencies": {
"#chakra-ui/checkbox": "^1.0.0",
"#chakra-ui/icons": "^1.0.0",
"#chakra-ui/react": "^1.8.7",
"#emotion/react": "^11.0.0",
"#emotion/styled": "^11.0.0",
"#testing-library/jest-dom": "^5.16.3",
"#testing-library/react": "^12.1.4",
"#testing-library/user-event": "^13.5.0",
"actioncable-js": "^5.0.0-rc2",
"axios": "^0.26.1",
"bootstrap": "^5.1.3",
"chakra-ui": "^0.3.9",
"emoji-picker-react": "^3.5.1",
"formik": "^2.2.9",
"framer-motion": "^6.2.8",
"google-map-react": "^2.1.10",
"js-logger": "^1.6.1",
"leaflet": "^1.8.0",
"ramda": "^0.28.0",
"react": "^16.8.6",
"react-bootstrap": "^2.2.2",
"react-bootstrap-validation": "^0.1.11",
"react-dom": "^16.8.6",
"react-leaflet": "^4.0.0",
"react-router-dom": "^5.2.0",
"react-scripts": "5.0.0",
"react-search-box": "^2.3.0",
"web-vitals": "^2.1.4",
"yup": "^0.32.11"
},
Solve Chakra UI dependency issues
Chakra UI 2 only compatible with react 18. Your react seems outdated.
Chakra UI has simple installation. You do not need such trash dependencies. Just delete all the project and try this line which is on the official website:
npm i #chakra-ui/react #emotion/react #emotion/styled framer-motion
Related
I'm trying to upgrade MUI v4 to MUI v5, and I've read the docs in migrating to v5 here.
I get this error message when running npm update
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: placemaker#0.1.0
npm ERR! Found: react#18.2.0
npm ERR! node_modules/react
npm ERR! react#"^18.2.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^17.0.0" from #mui/styles#5.11.7
npm ERR! node_modules/#mui/styles
npm ERR! #mui/styles#"^5.10.16" 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!
npm ERR! For a full report see:
Log files:
C:\Users\...\...\...\file.log
# npm resolution error report
While resolving: app#0.1.0
Found: react#18.2.0
node_modules/react
react#"^18.2.0" from the root project
Could not resolve dependency:
peer react#"^17.0.0" from #mui/styles#5.11.7
node_modules/#mui/styles
#mui/styles#"^5.10.16" from the root project
Fix the upstream dependency conflict, or retry
this command with --force or --legacy-peer-deps
to accept an incorrect (and potentially broken) dependency resolution.
my package.json dependencies
"dependencies": {
"#auth0/auth0-react": "^1.12.0",
"#emotion/react": "^11.10.5",
"#emotion/styled": "^11.10.5",
"#mui/icons-material": "^5.10.16",
"#mui/material": "^5.10.16",
"#mui/styles": "^5.10.16",
"#mui/x-data-grid": "^5.17.13",
"#mui/x-date-pickers": "^5.0.9",
"#reduxjs/toolkit": "^1.9.1",
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.4.0",
"#testing-library/user-event": "^13.5.0",
"#types/jest": "^27.5.2",
"#types/multer": "^1.4.7",
"#types/node": "^16.18.3",
"#types/pg": "^8.6.5",
"#types/react": "^18.0.25",
"#types/react-dom": "^18.0.9",
"#types/react-redux": "^7.1.24",
"auth0": "^3.1.1",
"autosuggest-highlight": "^3.3.4",
"axios": "^0.27.2",
"cors": "^2.8.5",
"dayjs": "^1.11.6",
"dotenv": "^16.0.3",
"express": "^4.18.2",
"express-oauth2-jwt-bearer": "^1.2.0",
"express-promise-router": "^4.1.1",
"helmet": "^6.0.1",
"multer": "^1.4.5-lts.1",
"nodemon": "^2.0.20",
"pg": "^8.8.0",
"pg-format": "^1.0.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-hook-form": "^7.40.0",
"react-redux": "^8.0.5",
"react-router-dom": "^6.4.3",
"react-select": "^5.6.1",
"socket.io": "^4.5.4",
"socket.io-client": "^4.5.4",
"typescript": "^4.9.3",
"uuid": "^8.3.2",
"web-vitals": "^2.1.4"
},
"devDependencies": {
"#types/autosuggest-highlight": "^3.2.0",
"#types/cors": "^2.8.12",
"#types/dotenv": "^8.2.0",
"#types/google.maps": "^3.50.5",
"#types/helmet": "^4.0.0",
"#types/uuid": "^8.3.4",
"concurrently": "^7.6.0",
"react-scripts": "5.0.1"
},
Not sure how to fix this, it appears the log tells me that react#^17.0.0 should work and I'm running version 18.
npm auidt --production provides the following info:
# npm audit report
json5 2.0.0 - 2.2.1
Severity: high
Prototype Pollution in JSON5 via Parse Method - https://github.com/advisories/GHSA-9c47-m6qq-7p4h
fix available via `npm audit fix`
node_modules/json5
1 high severity vulnerability
Try to update your dependencies using npm-check-updates
https://www.npmjs.com/package/npm-check-updates
Turns out, I was not thorough in reading the MUI docs, I had to:
npm uninstall #mui/style
npm i #mui/system
replace old code that was dependent on #mui/style
This removed the version mismatch.
I tried different ways i.e npm update --force / npm audit fix --force which just made it worse by downgrading to different packages creating many more vulnerabilities.
Thanks all for the help! Will accept sancelots answer though I did not try it, it seems like a beginner friendly solution
I am getting an error trying to install the npm onto my create-react - app application. I have tried deleting and reinstalling my node_modules folder as well as installing it with admin permissions and I am still receiving the same error
**Here is the output from the console
**
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: #nt/xps-base-app#1.5.5
npm ERR! Found: 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! peer react-router-dom#"\>=5.1.0" from #okta/okta-react#4.1.0
npm ERR! node_modules/#okta/okta-react
npm ERR! #okta/okta-react#"^4.1.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-router-dom#"5.1.2" from #nt/xps-base-app#1.5.5
npm ERR! node_modules/#nt/xps-base-app
npm ERR! #nt/xps-base-app#"^1.5.4" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react-router-dom#5.1.2
npm ERR! node_modules/react-router-dom
npm ERR! peer react-router-dom#"5.1.2" from #nt/xps-base-app#1.5.5
npm ERR! node_modules/#nt/xps-base-app
npm ERR! #nt/xps-base-app#"^1.5.4" from the root project
**list of dependencies from package.json
**
"dependencies": {
"#nt/eslint-config-xps-base": "^1.6.4",
"#nt/xps-base-app": "^1.5.4",
"#okta/okta-auth-js": "4.6.1",
"#okta/okta-react": "^4.1.0",
"#reduxjs/toolkit": "^1.6.1",
"#types/text-encoding": "^0.0.35",
"axios": "^0.21.1",
"eslint": "5.15.1",
"jest-junit": "6.4.0",
"moment": "2.24.0",
"prop-types": "15.7.2",
"react": "^17.0.1",
"react-axe": "3.3.0",
"react-cookie": "^4.0.3",
"react-dom": "^17.0.1",
"react-media": "2.0.0-rc.1",
"react-redux": "^7.2.4",
"react-router-dom": "^5.2.0",
"react-with-direction": "1.3.1",
"retry-axios": "^2.4.0",
"semantic-ui-react": "^2.0.3",
"uuid": "^3.4.0",
"react-scripts": "^4.0.1",
"semantic-ui-css": "^2.4.1",
"xps-react": "1.7.0",
"xps-style": "1.7.0"
},
"devDependencies": {
"#nt/xps-dev-utils": "^1.6.2",
"cross-env": "^7.0.3",
"react-hot-loader": "^4.13.0",
"text-encoding": "^0.7.0"
},
I don't know why we have this error a lot but a while ago someone else points out this error to me. That time we use a couple of commands. first this: npm install --legacy-peer-deps #youpackagename then we had to use this: npm install --force #yourpackagename you may not need the second command check your project before you use the second. You can go to this question for more information.
I'm trying to experiment with Material UI but running into problems with React v.18.2. I need to import the following:
import { MuiThemeProvider, createTheme } from '#material-ui/core/styles'
But when I run npm install #material-ui/styles, I get this error:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: zscratch#0.1.0
npm ERR! Found: react#18.2.0
npm ERR! node_modules/react
npm ERR! react#"^18.2.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16.8.0 || ^17.0.0" from #material-ui/styles#4.11.5
npm ERR! node_modules/#material-ui/styles
npm ERR! #material-ui/styles#"*" 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.
I have tried running the following, per this SO answer, and they did install but that has not helped any:
npm install #mui/material#latest #emotion/react#latest #emotion/styled#latest
npm install #mui/icons-material#latest
Here are my dependencies.
"dependencies": {
"#emotion/react": "^11.10.0",
"#emotion/styled": "^11.10.0",
"#fontsource/roboto": "^4.5.8",
"#mui/icons-material": "^5.8.4",
"#mui/material": "^5.10.1",
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.3.0",
"#testing-library/user-event": "^13.5.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-geolocated": "^4.0.3",
"react-router-dom": "^6.3.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
},
Bottom line: What do I need to do to be able to import what I need?
You can try yarn.
yarn add #material-ui/styles
Also you can install it by using --force.
npm i -f #material-ui/styles
It worked for me
Try these React 18 MUI update commands
npm i #material-ui/core --legacy-peer-deps
npm i #mui/icons-material --legacy-peer-deps
npm i #mui/lab --legacy-peer-deps
npm i #mui/x-data-grid --legacy-peer-deps
npm i #mui/x-data-grid-generator --legacy-peer-deps
i have a problem when i try to install react-leaflet-draw react-leaflet --save i had this error
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: siis-new#0.1.0
npm ERR! Found: react-leaflet#3.2.5
npm ERR! node_modules/react-leaflet
npm ERR! react-leaflet#"^3.2.5" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-leaflet#"^2.0.0" from react-leaflet-draw#0.19.8
npm ERR! node_modules/react-leaflet-draw
npm ERR! react-leaflet-draw#"*" 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/hafizewp/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/PC/.npm/_logs/2022-04-12T10_02_53_677Z-debug.log
and i dont want to change my react version !
We faced similar issue, it is due to conflict in versions !
Tried the --legacy-peer-deps option and we needed to add leafelet and leaflet-draw JS libs in addition to the react ones. Here is how our current dependencies looks like, we are using node v16.14.2
Hopefully this helps in your scenario
"dependencies": {
"#emotion/react": "^11.9.0",
"#emotion/styled": "^11.8.1",
"#id-sdk/util": "^3.0.0-pre.10",
"#material-ui/icons": "^4.11.3",
"#mui/icons-material": "^5.6.1",
"#mui/lab": "^5.0.0-alpha.77",
"#mui/material": "^5.6.1",
"#testing-library/jest-dom": "^5.16.4",
"#testing-library/react": "^12.1.4",
"#testing-library/user-event": "^13.5.0",
"axios": "^0.26.1",
"leaflet": "^1.7.1",
"leaflet-draw": "^1.0.4",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-dotenv": "^0.1.3",
"react-leaflet": "3.2.1",
"react-leaflet-draw": "0.19.8",
"react-query": "^3.34.19",
"react-scripts": "5.0.0",
"uninstall": "^0.0.0",
"web-vitals": "^2.1.4"
}
I'm using React Material UI and I get this error : Module not found: Can't resolve '#date-io/date-fns'.
Here are the dependencies that I have in my package.json file :
"version": "0.1.0",
"private": true,
"dependencies": {
"#material-ui/core": "^4.12.1",
"#material-ui/icons": "^4.11.2",
"#material-ui/pickers": "^3.3.10",
"#testing-library/jest-dom": "^5.11.8",
"#testing-library/react": "^11.2.2",
"#testing-library/user-event": "^12.6.0",
"antd": "^4.16.6",
"axios": "^0.21.1",
"bootstrap": "^4.5.3",
"query-string": "^4.3.4",
"react": "^17.0.1",
"react-bootstrap": "^1.4.0",
"react-dom": "^17.0.1",
"react-owl-carousel": "^2.3.3",
"react-router-dom": "^5.2.0",
"react-script-tag": "^1.1.2",
"react-scripts": "4.0.1",
"react-seat-picker": "^1.5.3",
"react-tooltip": "^4.2.21",
"web-vitals": "^0.2.4"
},
I tried installing these libraries but it keeps showing errors in command prompt
D:\WebSites\site>npm i --save date-fns#next #date-io/date-fns
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: site#0.1.0
npm ERR! Found: date-fns#2.0.0-beta.5
npm ERR! node_modules/date-fns
npm ERR! date-fns#"2.0.0-beta.5" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peerOptional date-fns#"^2.0.0" from #date-io/date-fns#2.11.0
npm ERR! node_modules/#date-io/date-fns
npm ERR! #date-io/date-fns#"*" 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\Ryan\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\Ryan\AppData\Local\npm-cache\_logs\2021-08-11T12_31_59_156Z-debug.log
Install this package works for me.
date-fns
npm i date-fns