source-map-explorer error: Check that you are using the correct source map

Question

I have a JavaScript project that uses Webpack 4 with source maps:

mode: 'development',
entry: { app: './src/app.js' },
output: {
    filename: 'app.[contenthash].js',
    path: outputPath,
},
devtool: 'sourcemap',
externals,
....

It generates 2 JS files in my dist folder: app.[contenthash].js and app.[contenthash].js.map attached to it.

I installed source-map-explorer: https://www.npmjs.com/package/source-map-explorer

But when i run it on these files, i get the error:

Your source map refers to generated column 8 on line 17, but the source only contains 0 column(s) on that line. Check that you are using the correct source map.

How can i fix that?

EDIT:

When i change Webpack's mode to production it's not throwing that error. Why? Now with production mode, it just hangs when i run it.. how long does it suppose to take?

P.M · Accepted Answer · 2020-11-16 21:50:18Z

51

This answer is based on @piecioshka's ~ but disables column/line mapping check, as indicated in this source-map-explorer#README

The full command looks as:

npx source-map-explorer dist/main.js --no-border-checks

answered Nov 16, 2020 at 21:50

P.M

3,1983 gold badges47 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

piecioshka · Accepted Answer · 2020-04-14 22:37:02Z

4

I had the same error. I made a general mistake: not generated a minified version.

source-map-explorer based on two files:

bundle.js — a minified version
bundle.js.map — source maps (generated for bundle.js)

Step 1. Build a dist file + source maps

eg. via webpack

npx webpack -p src/main.js --production --devtool source-map

eg. via rollup

npx rollup -i src/main.js -o dist/bundle.js -m

Step 2. Audit by

npx source-map-explorer dist/main.js

answered Apr 14, 2020 at 22:37

piecioshka

5,1303 gold badges23 silver badges30 bronze badges

Collectives™ on Stack Overflow

source-map-explorer error: Check that you are using the correct source map

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related