基礎(chǔ)
SourceMap是一種映射關(guān)系裂逐。當(dāng)項(xiàng)目運(yùn)行后，如果出現(xiàn)錯(cuò)誤逊桦，錯(cuò)誤信息只能定位到打包后文件中錯(cuò)誤的位置眨猎。如果想查看在源文件中錯(cuò)誤的位置，則需要使用映射關(guān)系强经，找到對(duì)應(yīng)的位置睡陪。
const path = require('path');
module.exports = {
devtool: 'none', // SourceMap
entry: './src/index.js', // 入口文件
output: {
filename: 'bundle.js', // 文件名
path: path.resolve(__dirname, 'dist') // 文件夾
}
}
參數(shù)
1、source-map
會(huì)生成map格式的文件匿情，里面包含映射關(guān)系的代碼
devtool: 'source-map',
2兰迫、inline-source-map
不會(huì)生成map格式的文件，包含映射關(guān)系的代碼會(huì)放在打包后生成的代碼中
devtool: 'inline-source-map',
3炬称、inline-cheap-source-map
cheap有兩種作用：一是將錯(cuò)誤只定位到行汁果，不定位到列。二是映射業(yè)務(wù)代碼转砖，不映射loader和第三方庫等须鼎。
會(huì)提升打包構(gòu)建的速度。
devtool: 'inline-cheap-source-map',
4府蔗、inline-cheap-module-source-map
module會(huì)映射loader和第三方庫
devtool: 'inline-cheap-module-source-map',
5晋控、eval
用eval的方式生成映射關(guān)系代碼，效率和性能最佳姓赤。但是當(dāng)代碼復(fù)雜時(shí)赡译，提示信息可能不精確。
devtool: 'eval',
推薦方式
開發(fā)環(huán)境
devtool: 'cheap-module-eval-source-map',
生產(chǎn)環(huán)境
devtool: 'cheap-module-source-map',
