让 webpack 加载 Source Map

在浏览器中运行的 JavaScript 代码都是编译器输出的代码,这些代码的可读性很差。如果在开发过程中遇到一个不知道原因的 Bug,则你可能需要通过断点调试去找出问题。 在编译器输出的代码上进行断点调试是一件辛苦和不优雅的事情, 调试工具可以通过 Source Map 映射代码,让你在源代码上断点调试。

方案一:Webpack 支持生成 Source Map,只需在启动时带上 --devtool source-map 参数。 加上参数重启 DevServer 后刷新页面,再打开 Chrome 浏览器的开发者工具,就可在 Sources 栏中看到可调试的源代码了。

方案二:直接在Webpack.config.js 中加入属性  devtool: 'source-map' 即可

原文地址:https://www.cnblogs.com/CyLee/p/8327738.html