How to fix error "Failed to compile : ./node_modules/@react-leaflet/core/esm/path.js 10:41 Module parse failed: Unexpected token (10:41)"

Solution 1:

I found a way to fix it.

Steps to fix:-

Open your package.json file and edit your browserslist as follows.

 "browserslist": {
   "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
},

to

"browserslist": [
   ">0.2%",
  "not dead",
  "not op_mini all"
],

Once you've done this, Delete node_modules/.cache directory.

Then try npm install

and npm start

Tadaaa!

References:-

• https://github.com/facebook/create-react-app/issues/9468#issuecomment-694191642
• https://github.com/PaulLeCam/react-leaflet/issues/877

Solution 2:

The issue eventually seems to be related with create-react-app and the way it bundles files and seems to be resolved if you replace browser targets from:

"browserslist": {
   "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
},

to

"browserslist": [
   ">0.2%",
  "not dead",
  "not op_mini all"
],

Then stop the server and rerun it.

Credits go to bkiac official create-react-app github issue

Edit

You can reproduce the error and the fix if you download this codesandbox. When you open it, it works but if you download it and run it locally you can see the error using the first browserslist options in package.json. If you stop the server, replace browserslist options with the new and rerun the application you can see that it works as expected.