CleanWebpackPlugin 介绍

CleanWebpackPlugin 是一个用于清理构建产物的 Webpack 插件。它可以自动删除之前的构建产物，避免文件冲突，并保持构建目录的整洁。

特点

自动清理构建目录
可配置的清理规则
支持多种文件类型清理
与 Webpack 4 兼容

安装

npm install clean-webpack-plugin --save-dev

使用

在你的 Webpack 配置文件中，添加以下代码：

const { CleanWebpackPlugin } = require('clean-webpack-plugin');

module.exports = {
  // ...其他配置...
  plugins: [
    new CleanWebpackPlugin(),
  ],
};

配置

CleanWebpackPlugin 支持多种配置选项，以下是一些常用的配置：

cleanOnceBeforeBuildPatterns: 清理构建目录的规则，默认为 ['**/node_modules/**', '**/dist/**']。
cleanStaleWebpackAssets: 是否清理未使用的缓存文件，默认为 false。
cleanAfterEveryBuildPatterns: 是否在每次构建后清理，默认为 false。

示例

const { CleanWebpackPlugin } = require('clean-webpack-plugin');

module.exports = {
  // ...其他配置...
  plugins: [
    new CleanWebpackPlugin({
      cleanOnceBeforeBuildPatterns: ['**/dist/**'],
      cleanStaleWebpackAssets: true,
    }),
  ],
};

更多配置选项，请参考 CleanWebpackPlugin 文档。