Solvedreact leaflet Can't compile react-leaflet

Bug report

Can't compile blank react app after adding react-leaflet. Throws following error:

./node_modules/@react-leaflet/core/esm/path.js 10:41
Module parse failed: Unexpected token (10:41)
File was processed with these loaders:

  • ./node_modules/react-scripts/node_modules/babel-loader/lib/index.js
    You may need an additional loader to handle the result of these loaders.
    | useEffect(function updatePathOptions() {
    | if (props.pathOptions !== optionsRef.current) {
    const options = props.pathOptions ?? {};
    | element.instance.setStyle(options);
    | optionsRef.current = options;


Expected behavior

Should compile and be able to use react leaflet

Steps to reproduce

npx create-react-app test
cd test
npm install leaflet react-leaflet
add import { MapContainer, TileLayer, Marker, Popup } from 'react-leaflet' on src/App.js
npm start


For me #891 (comment) this resolved issue, but comments below indicate it's not working for everybody. Please try this and check if it's working for you or not.

33 Answers

✔️Accepted Answer

I assume this is can be treated as critical..

Other Answers:

This lib needs a new maintainer that understands the issue.

This has already been addressed here:
#881 (comment)
#877 (comment)

A quick fix is to downgrade Leaflet. In your package.json file, change these lines:

"react-leaflet": ">=3.1.0 <3.2.0 || ^3.2.1",
"@react-leaflet/core": ">=1.0.0 <1.1.0 || ^1.1.1"

Then remove the node_modules folder and run npm install.

Optional: npm install --save @monsonjeremy/react-leaflet
See: #885 (comment)
Use at your own risk though, as the author will not be further maintaining this package. It is only to hold over until his PR gets merged.

This doesn't resolve the issue, and also isn't working for everybody.

Create React App, for example, expects a different structure. You'll discover this if you read the referenced issues.

Don't close this ticket!

Changing the browser target is a stupid workaround but not a fix. It's also not necessary for any of the other probably thousands of packages in a typical project.

More Issues: