Search code examples
reactjsnpmleafletreact-leafletreact-leaflet-draw

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


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 !


Solution

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