webpack中的sourceMap

一、sourceMap的定义与作用

sourceMap：是一个信息文件，里面存储着位置信息。
作用：出错时，出错工具直接显示原始代码，而不是转换后的代码，方便后期调试。

二、sourceMap默认问题处理

1.问题描述

开发环境下默认生成的sourceMap，记录的是生成后代码的位置，会导致运行时报错的行数与原代码的行数不一致的问题。

2.解决方法

在webpack.config.js中增加如下配置

module.exports = {
	devtool:'eval-source-map',
}

3.生产环境下的sourceMap

在生产环境下，如果省略了devtool选项，最终生产的文件中不包含sourceMap，能够防止原始代码通过sourceMap的形式暴露给别有所图之人。

4.只定位行数，不暴露源码

在webpack.config.js中更改如下配置:

module.exports = {
	devtool:'nosources-source-map',
}

适用情况：实际发布的时候