webpack 的 SplitChunksPlugin 插件具体怎样使用来减小chunk-vendors 的体积？

使用 webpack 的 SplitChunksPlugin 插件可以将代码分割到不同的文件中，从而减小 chunk-vendors 的体积。具体使用方法如下：

1. 在 webpack 配置文件中添加以下代码：

optimization: {
  splitChunks: {
    chunks: 'all',
    name: 'vendors',
    minChunks: 2,
    maxInitialRequests: 5,
    cacheGroups: {
      vendor: {
        test: /[\\/]node_modules[\\/]/,
        priority: -10
      }
    }
  }
}

2. 上述代码中，`chunks: 'all'` 表示将所有代码块都进行分割，`name: 'vendors'` 表示分割后的文件名为 `vendors`，`minChunks: 2` 表示当一个模块被至少两个 chunk 使用时才进行分割，`maxInitialRequests: 5` 表示一个入口最多有 5 个异步请求，`cacheGroups` 则是用来配置缓存组的。

3. 在上述代码中，`cacheGroups` 中的 `vendor` 表示将所有来自 node_modules 目录下的模块都打包到一个叫做 vendor 的代码块中，`priority: -10` 表示当一个模块同时满足多个缓存组的条件时，优先选择被 `priority` 数值更大的缓存组打包。

4. 最后，需要在模板文件中引入打包后的文件：

<script src="<%= htmlWebpackPlugin.files.chunks.vendors.entry %>"></script>

通过以上步骤，可以将 chunk-vendors 文件分割成多个文件，从而减小文件体积。