一、使用source map

       当 webpack 打包源代码时，可能会很难追踪到错误和警告在源代码中的原始位置。例如，如果将三个源文件（a.js, b.js 和 c.js）打包到一个 bundle（bundle.js）中，而其中一个源文件包含一个错误，那么堆栈跟踪就会简单地指向到 bundle.js。这并通常没有太多帮助，因为你可能需要准确地知道错误来自于哪个源文件。

       为了更容易地追踪错误和警告，JavaScript 提供了 source map 功能，将编译后的代码映射回原始源代码。如果一个错误来自于 b.js，source map 就会明确的告诉你。

1、在webpack.config.js中添加inline-source-map选项

2、在print.js中打印错误反馈

3、在终端运行webpack

先进入我们的项目目录

运行：

4、打开主页面，进入控制台，可以看到，此时我们 的报错信息会准确定位到我们的出错代码位置，更加人性化。