Could not load content for webpack source file in Chrome sources tab

Viewed 6057

I'm using webpack v4.16.2 as my bundle tool, and set devtool to 'source-map'. I'm trying to debug the source file through the Chrome sources tab. However, when I click the source file lie down webpack:// directory, an error occurred:

enter image description here

I'm not using webpack-dev-server, just build the source files into the dist/ folder, and load the page through Nginx.

What does this error mean? I'm pretty sure that the source map files are generated. How can I fix this?

Thanks in advance.

2 Answers

I have been the same issue this whole day:

try set webpack.prod.config

  optimization: {
    minimize: false
  }

Here is what I found so far:

source-map devtool mode generate .map file lost sourcesContent property when minify the code which is default in production mode. And the 'webpack://XXXX' to locate the sourcesContent where the original code is, then the error happens.

I was getting exactly the same problem, same error message etc when trying to debug typescript / html in Google Chrome.

The solution is to empty your cache.

Press Control + H to load up your browser history, and press the Clear Data button.

The try pressing Control + O or Control + P to load/select a source file again.

enter image description here

Related