Webpack Source Map

如果存在文件中的代码错误，控制台报错说打包后文件（这里是main.js）的哪一行出现了错误，而不是告诉我们真正的那个入口文件的哪一行出现了错误。这对我们的代码调试极其不便利。

Content.js:

控制台报错：

如果希望映射出错误文件的具体位置。需要打开sourceMap功能。

还有一点需要注意的是，在mode为开发环“development”时候，

sourceMap功能是默认打开的。

如果打开sourceMap功能：

报错信息就会换成文件的映射：

devtool也有很多关于soucemap的设置，比如在生产环境下我们常用的是

在开发环境下网上最推荐的是：

这种设置会提示的全面且性能较好。

这些不同的设置都会产生不同的反应。会带来性能上的差异。

详细可以参阅官方文档。