Sourcemaps are detected in chrome but original source is not loaded, using webpack-2

Question

When running an application that is built using webpack 2, sourcemaps are detected in chrome but original source is not loaded. I\'m using webpack beta21.

These file

Answer 1

If you're mapping to a workspace, that means you already have the source code. Including the source code in your source map is creating an unnecessary redundancy.

Use nosources-source-map instead.

Answer 2

Generated files with source maps won't automatically redirect to their original files, because there's potentially a 1-to-many relationship.

If you see the message Source Map Detected, the original file should already appear on the side file tree or the file explorer via Crl + P. If you don't know the original file name, you can open the source map file itself.

1. The source map path can be identified by a //# sourceMappingURL= comment or the X-SourceMap header:

2. Open up the source map via url and look for the sources property for the original file name:

3. The original file should be visible in the sources panel:

If you don't see the message Source Map Detected

You can manually add an external source map by right clicking and selecting Add Source Map:

Additional Resources

• If that still doesn't work, you can try a Source Map Validator
• For webpack specifically, you can configure the devtool property

Answer 3

The issue with external source maps was fixed in Chrome 52 but it looks like you've got your devtool set differently from mine, I use:

devtool: '#source-maps'

How are you building your source? If you're running with -d it will switch to inline source maps