source-map:一种提供源代码 到 构建后 代码映射技术(如果构建后的代码出错了,通过映射可以追踪源代码的错误)
1,source-map :外部,错误代码准确信息 和 源代码的错误位置
2,inline-source-map:内联,只生成一个内联 source-map,错误代码准确信息 和 源代码的错误位置
3,hidden-source-map:外部,错误代码错误原因,但是没有错误位置,不能追踪源代码错误,只能提示到构建后代码的错误位置
4,eval-source-map:内联,每一个文件都生成对应的 source-map,都在 eval,错误代码准确信息,和源代码的错误位置
5,nosources-source-map:外部,错误代码准确信息,但是没有任何源代码信息
6,cheap-source-map:外部,错误代码准确信息,和源代码的错误位置,只能精确到行
7,cheap-module-source-map:外部,错误代码准确信息,和源代码的错误位置,module 会将 loader 的 source-map 加入
内联和外部的区别:
①外部生成了文件,内联没有
②内联构建速度更快
开发环境(速度快,调试更友好)
①速度快:eval > inline > cheap > ...
eval-cheap-amp, eval-source-map
②调试更友好:
source-map cheap-module-source-map cheap-source-map
③一般选择:eval-source-map
eval-cheap-module-source-map
生产环境:源代码要不要隐藏,调试要不要更友好,内联会让代码体积变大,所以生产环境不用内联
① nosources-source-map 全部隐藏
② hidden-source-map 只隐藏源代码,会提示构建后代码错误信息
③一般选择:source-map
cheap-module-source-map