如何配置 webpack 5.x 以在构建之前删除 dist 文件夹

Question

在下一次构建之前，我想删除以前的构建，因为如果我们不删除旧的构建，则可能无法尽快找到一些未生成输出文件的更改。我现在尝试使用此命令来完成这项工作package.json：

"dev": "rm -rf src/bundle && webpack --mode development --config build/webpack.dev.config.js",

但我觉得这种方式对于命令来说可能有点危险rm -rf，有更好的建议吗？

Answer 1

查看文档：https://webpack.js.org/guides/output-management/#cleaning-up-the-dist-folder

添加clean:true

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
entry: {
  index: './src/index.js',
  print: './src/print.js',
},
plugins: [
  new HtmlWebpackPlugin({
    title: 'Output Management',
  }),
],
output: {
  filename: '[name].bundle.js',
  path: path.resolve(__dirname, 'dist'),
  clean: true
},

};