problem when i npm install react-leaflet-draw react-leaflet --save

Question

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: [email protected]
npm ERR! Found: [email protected]
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 [email protected]
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 !

Answer 1

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"
}