Sourcemap warning with webpack 5

[jsmolina]

hi,

I'm getting this warning:

WARNING in ./node_modules/react-csv-downloader/dist/esm/index.js Module Warning (from ./node_modules/source-map-loader/dist/cjs.js): Failed to parse source map from 'node_modules/react-csv-downloader/src/index.tsx' file: Error: ENOENT: no such file or directory, open 'node_modules/react-csv-downloader/src/index.tsx'

it's only happening on react-csv-downloader, so I guess it has some relation

[myeongwooni]

@jsmolina Hello! Did you figure out about it? It happens to me too. ;(

[jonenst]

Hi @dolezel, this happens for all users of this library with the new Create React App 5 (webpack 5). It's also very troubling as the warning is prominently displayed in the npm start output. To reproduce, just create a new CRA project npx create-react-app foo, npm install react-csv-downloader and add import CsvDownloader from 'react-csv-downloader'; in app.js

This warning reflects a real problem with the published package: this package is publishing sourcemaps but not publishing source https://unpkg.com/browse/[email protected]/dist/esm/index.js line71 //# sourceMappingURL=index.js.map https://unpkg.com/browse/[email protected]/dist/esm/index.js.map "sourceRoot":"","sources":["../../src/index.tsx"], but there is no src folder in the tarball so we get warnings.

From what I understand (not an npm publishing best practice expert), it should either not publish sourcemaps:

$ git diff tsconfig.json
diff --git a/tsconfig.json b/tsconfig.json
index c50f051..6f2cdd9 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,7 +6,7 @@
     "lib": ["es2017", "dom"],
     "moduleResolution": "node",
     "allowJs": false,
-    "sourceMap": true,
+    "sourceMap": false,
     "jsx": "react",
     "declaration": true,
     "forceConsistentCasingInFileNames": true,

this results in not having the sourceMappingUrl comment in the js files in dist/, and not having the map files in the dist folder.

or publish the source files:

diff --git a/.npmignore b/.npmignore
index 03b4c1b..ac3857f 100644
--- a/.npmignore
+++ b/.npmignore
@@ -1,5 +1,4 @@
 .*
 mocha*
 node_modules/
-src/
 example/

Here's the output of npm pack for the different possibilities: current:

npm notice package size:  12.7 kB                                 
npm notice unpacked size: 92.9 kB                                 
npm notice total files:   25                                      

no maps:

npm notice package size:  9.3 kB                                  
npm notice unpacked size: 59.3 kB                                 
npm notice total files:   19                                      

maps and sources:

npm notice package size:  15.4 kB                                 
npm notice unpacked size: 108.7 kB                                
npm notice total files:   28                                      

Given the low byte size of all the packages, maybe the best is to publish source files ? This would allow to have a readonly debugging experience with browser devtools or vscode when stepping into this library code and setting breakpoints.

here are similar issues in other projects: https://github.com/googleapis/google-cloud-node/issues/2867 https://github.com/facebook/create-react-app/discussions/11767#discussioncomment-1969071 https://github.com/facebook/create-react-app/pull/11752 ...probably many more..

Cheers, Jon

[dolezel]

Completed in #321

[jonenst]

Thanks for shipping this in 2.9.0, no more warnings for me !