Module parse failed: additional babel_loader

Question

I have been using react-leaflet for a while now, and after a few weeks I deleted the files inside the node_modules and reinstalled them, and I did not touch the react-leaflet version at all, but when I try to run the project, it gives me an 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;

---

Answer 1

In order to run it, the react-leaflet library must be downgraded. These are the steps:

1. remove react-leaflet: npm uninstall react-leaflet

2. update your react-scripts version to 3.3.0 or higher: npm install --save react-scripts@latest

3. remove node_module directory (optional)

4. clean cache: npm cache clean --force

5. Install the working versions: npm i react-leaflet@3.1.0 @react-leaflet/core@1.0.2

You can now run the client doing npm start.