8 Webpack中的配置-Devtool

Devtool

要对Webpack构建项目进行开发调试需要使用Source Map，Devtool决定了Webpack提供什么强度的Source Map来支持开发调试。Devtool默认是关闭的，可以根据自己的需求进行配置：

module.exports = {
    
    
    devtool: 'eval'
}

不同的值会明显影响到构建(build)和重新构建(rebuild)的速度。其中一些值适用于开发环境，一些适用于生产环境。对于开发环境，通常希望更快速的Source Map，需要添加到Bundle中以增加体积为代价，但是对于生产环境，则希望更精准的Source Map，需要从Bundle中分离并独立存在。Devtool内部是使用SourceMapDevToolPlugin/EvalSourceMapDevToolPlugin插件来实现的。

为了更多精细化的配置，可以使用SourceMapDevToolPlugin/EvalSourceMapDevToolPlugin来配置Source map，注意这两种方式不能同时使用，不然会重复调用这些插件。

更多Devtool的配置，请前往https://webpack.js.org/configuration/devtool/进行查阅。