0

I have been working with react-leaflet for a couple of weeks without any issue. I had the bad idea to clean my node_module directory and since then I get the following error while bundling my app (with webpack 4):

[error] ./node_modules/@react-leaflet/core/esm/path.js 10:41
[error] Module parse failed: Unexpected token (10:41)
[error] File was processed with these loaders:
[error]  * ./node_modules/source-map-loader/index.js
[error] You may need an additional loader to handle the result of these loaders.
[error] |   useEffect(function updatePathOptions() {
[error] |     if (props.pathOptions !== optionsRef.current) {
[error] >       const options = props.pathOptions ?? {};
[error] |       element.instance.setStyle(options);
[error] |       optionsRef.current = options;

I understand that source-map-loader is not happy about the nullish coalescing operator found line 10. So I simply added babel-loader before and now everything works fine as expected.

But I still would like to understand the mess with NPM:

    1. I am new to the Javascript world, but shouldn't library authors provide plain old javascript on NPM??
    1. The funny thing is that after recovering my deleted node_modules directory (I had kept a copy), I found out that line 10 is replaced by const options = (_props$pathOptions = props.pathOptions) != null ? _props$pathOptions : {};... How is it possible that the exact same version of react-leaflet (v3.1.0) was a couple of weeks ago plain old javascript and now it is not??

Note: I use node 14.17.0 and npm 6.14.13

stackoverflowed
  • 686
  • 8
  • 22

1 Answers1

0

This is likely a NodeJS versioning issue -- it seems that the nullish coalescing operator only became available in NodeJS in version 14. If you upgrade to NodeJS version 14+, this error should go away. Alternatively, you could use lower versions of these packages that don't include this operator, if that works for you.

Nisala
  • 1,313
  • 1
  • 16
  • 30