source map是什么
source map 是一个信息文件，里面储存着位置信息，是转化（打包压缩混淆）后代码与源文件代码的位置映射
source map的作用
在代码调试的时候，能快速定位到源文件的位置
如何在webpack中配置
在webpack.config.js中，有个devtool的属性可以配置
module.exports = {
mode: "development",
devtool: "cheap-module-eval-source-map",
}
webpack中的source map都有哪些值
官方地址：Devtool
| devtool 值 | comment 注解说明 | recommend 推荐 |
|---|---|---|
| none | 不生成 | Recommended choice for production builds with maximum performance. 具有最佳性能的生产版本的推荐选择。 |
| eval | 打包的代码会用eval包住 | Recommended choice for development builds with maximum performance. 具有最佳性能的开发构建的推荐选择。 |
| eval-cheap-source-map | Tradeoff choice for development builds. 开发构建的权衡选择。 |
|
| eval-cheap-module-source-map | Tradeoff choice for development builds. 开发构建的权衡选择。 |
|
| eval-source-map | Recommended choice for development builds with high quality SourceMaps. 具有高质量SourceMaps的开发版本的推荐选择。 |
|
| cheap-source-map | - | |
| cheap-module-source-map | - | |
| source-map | Recommended choice for production builds with high quality SourceMaps. 具有高质量SourceMaps的生产版本的推荐选择。 |
|
| inline-cheap-source-map | - | |
| inline-cheap-module-source-map | - | |
| inline-source-map | Possible choice when publishing a single file. 发布单个文件时的可能选择。 |
不再列举，因为其他的不常用
建议
开发环境 ：eval-cheap-module-source-map（4.* 时的 cheap-module-eval-source-map）
生产环境：cheap-module-source-map
