chainWebpack是什么

`chainWebpack` 是 Webpack 4 中新增的一种方式，用于允许开发者在 Webpack 构建流程中操纵和扩展 Webpack 的配置。`chainWebpack` 提供了一种链式调用的方式来配置 Webpack，使得配置更加灵活和可扩展。

使用 `chainWebpack` 可以通过以下方式修改 Webpack 配置：

- 使用 `.entry` 方法指定入口文件；
- 使用 `.output` 方法指定输出文件；
- 使用 `.module` 和 `.rule` 方法指定模块加载器；
- 使用 `.resolve` 方法指定模块的解析方式；
- 使用 `.plugin` 方法添加插件；
- 使用 `.optimization` 方法配置优化选项。

例如，以下代码使用 `chainWebpack` 配置了打包后的文件名为 `app.[hash].js`，并添加了 `vue-loader` 和 `babel-loader` 两个加载器：

module.exports = {
  chainWebpack: config => {
    config
      .output
      .filename('app.[hash].js')
    
    config
      .module
      .rule('vue')
      .use('vue-loader')
      .loader('vue-loader')
      .end()
    
    config
      .module
      .rule('js')
      .use('babel-loader')
      .loader('babel-loader')
      .end()
  }
}

需要注意的是，`chainWebpack` 方法是可选的，如果不需要修改 Webpack 配置，则可以直接省略该方法。同时，`chainWebpack` 方法也可以与常规的 Webpack 配置选项一起使用，二者的配置将会被合并。