output.clean
在 Webpack 5 中，output.clean 配置项是一个新的功能，旨在自动清理输出目录（例如 dist 文件夹），在每次构建时删除其中的旧文件。这个配置项使得构建输出更加干净，避免了存留旧的、不再需要的文件。
1. 基本功能
output.clean 可以用来控制 Webpack 在构建前是否清除输出目录中的文件。通常，WebPack 会将新构建的文件输出到一个指定的目录（比如 dist），并且保留先前构建的文件。使用 output.clean 可以在每次构建时自动删除旧的文件，确保输出目录的清洁。
2. 配置方式
output.clean 可以是一个布尔值，或者是一个对象，提供更细粒度的配置选项。
2.1 基本配置（布尔值）
如果设置为 true，Webpack 将在每次构建之前清空输出目录中的所有文件。
module.exports = {output: {path: path.resolve(__dirname, 'dist'),clean: true // 在每次构建时清理 dist 目录}
};
2.2 细粒度配置（对象）
output.clean 也可以是一个对象，提供更多配置项来控制如何清理输出目录。
module.exports = {output: {path: path.resolve(__dirname, 'dist'),clean: {keep: /[\\/]static[\\/]/, // 保留 static 目录下的文件dangerouslyAllowCleanPatternsOutsideProject: true // 允许删除项目外的文件（不推荐使用）}}
};
3. 可用配置选项
当 output.clean 设置为对象时，你可以配置以下选项：
-
keep: 可以设置一个正则表达式或一个字符串数组，表示要保留的文件或目录。如果你希望保留输出目录下的某些文件或目录，可以使用这个选项。例如，保留static目录下的文件。
keep: /[\\/]static[\\/]/, // 保留 static 目录下的文件
dangerouslyAllowCleanPatternsOutsideProject: 如果设置为true，Webpack 将允许删除项目外部的文件（即输出目录之外的文件）。这个选项应该谨慎使用，因为它可能会删除你不希望删除的文件。
dangerouslyAllowCleanPatternsOutsideProject: true // 不推荐使用，可能删除项目外的文件
4. 默认行为
如果不配置 output.clean，Webpack 默认不会清理输出目录。这意味着，如果你在一个持续集成的环境中构建或频繁构建时，旧文件可能会留在输出目录里，造成不必要的文件堆积。
5. 性能影响
启用 output.clean 时，每次构建前都会删除输出目录中的文件。如果你有非常大的输出目录，可能会导致一些性能上的开销。不过在多数情况下，这个过程是快速的，而且可以确保构建输出是干净的。
6. 结合插件使用
虽然 output.clean 可以清理构建输出目录，但在一些复杂的构建中，你可能还需要与其他插件（如 clean-webpack-plugin）配合使用，以便更精细地控制输出目录清理的过程。通常，output.clean 已经足够满足常规需求。
7. 总结
output.clean：用于在构建时清理输出目录，避免残留旧的构建文件。- 布尔值配置：设置为
true时，Webpack 每次构建前会清理输出目录。 - 对象配置：可以用来保留特定文件或目录，或者允许删除项目外的文件。
- 推荐使用：推荐开启
output.clean，以确保输出目录的清洁，避免过时的文件干扰构建。
