如何获取 Chrome 中示例的源映射

how to get source map for examples in Chrome

使用 Chrome 中的 ol 5 示例,当我在开发工具中打开源文件时,我只看到已编译的 webpack 版本,并且收到消息 "Source Map detected ..." 但我在不知道如何打开关联的 .map 文件。

根据我对其他 webpack 编译项目的非常有限的经验,我没有采取任何行动就显示了源代码。

您需要打开浏览器 Dev Tools,转到 "Sources",在右侧面板上,您单击 simple.js。它表示 "Source Map detected".

然后,进入 "webpack" 目录,您应该会看到来自 sourcemap 的未缩小的 simple.js 文件。见下图,我设置了一个断点来说明