webpack--devtool 设置

source-map

提供构建后的代码映射到源代码的技术，可已具体追溯源代码位置。

使用

module.export = {
    devtool:'source-map'
}

devtool可选值及区别

1.source-map

外部生成map

会有错误代码的准确信息和源代码的错误位置

2.inline-source-map

只生成一个内联的map

会有错误代码准确信息和源代码错误位置

3.hidden-source-map

外部生成一个map文件

会有错误代码准确信息，编译后代码位置，没有源代码位置

4.eval-source-map

每个文件都会生成内联map

会有错误代码准确信息和源代码错误位置

5.nosources-source-map

生成外部的map

但没有任何源代码信息

6.cheap-source-map

生成外部的map

会有错误代码准确信息 和源代码错误位置(位置只能精确到行)

7.cheap-module-source-map

生成外部的map

会有错误代码准确信息 和源代码错误位置



//区别

速度eval>inline>cheap>...

调试更友好：

source-map>cheap-moudle>cheap