无法在 Chrome 源选项卡中加载 webpack 源文件的内容答案

【问题标题】：Could not load content for webpack source file in Chrome sources tab无法在 Chrome 源选项卡中加载 webpack 源文件的内容
【发布时间】：2020-06-07 17:15:58
【问题描述】：

我使用 webpack v4.16.2 作为我的打包工具，并将devtool 设置为'source-map'。我正在尝试通过 Chrome 源选项卡调试源文件。但是，当我点击源文件躺webpack://目录时，出现错误：

我没有使用webpack-dev-server，只是将源文件构建到dist/文件夹中，然后通过Nginx加载页面。

这个错误是什么意思？我很确定源映射文件已生成。我该如何解决这个问题？

提前致谢。

【问题讨论】：

你能解决这个问题吗？

标签： webpack source-maps

【解决方案1】：

我这一天都是同样的问题：

尝试设置 webpack.prod.config

  optimization: {
    minimize: false
  }

这是我目前发现的：

source-map devtool 模式生成 .map 文件时会丢失 sourcesContent 属性，当缩小 production 模式默认的代码时。和 'webpack://XXXX' 定位到sourcesContent 原来代码所在的位置，然后就会发生错误。

【讨论】：

【解决方案2】：

尝试在 Google Chrome 中调试 typescript / html 时，我遇到了完全相同的问题、相同的错误消息等。

解决方案是清空缓存。

按 Control + H 加载浏览器历史记录，然后按清除数据按钮。

尝试按 Control + O 或 Control + P 再次加载/选择源文件。

【讨论】：