如何解决CleanWebpackPlugin无法在Webpack 5中清理
我正在将Webpack 5.3.2的最新版本与“ clean-webpack-plugin”:“ ^ 3.0.0”一起使用。显然,在我构建时,该插件无法清理dist文件夹。
这是我的Webpack信息:
Binaries:
Node: 12.18.1 - ~/.nvm/versions/node/v12.18.1/bin/node
Yarn: 1.22.4 - ~/.nvm/versions/node/v12.18.1/bin/yarn
npm: 6.14.8 - ~/.nvm/versions/node/v12.18.1/bin/npm
Browsers:
Chrome: 86.0.4240.111
Firefox: 82.0
Packages:
clean-webpack-plugin: ^3.0.0 => 3.0.0
copy-webpack-plugin: ^6.2.1 => 6.2.1
terser-webpack-plugin: ^5.0.3 => 5.0.3
webpack: ^5.3.2 => 5.3.2
webpack-cli: ^4.1.0 => 4.1.0
Global Packages:
webpack-cli: 4.1.0
webpack: 5.3.2
这是我的webpack配置:
const path = require('path');
const webpack = require('webpack');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const CopyPlugin = require('copy-webpack-plugin');
module.exports = {
mode: 'development',entry: './src/index.ts',plugins: [
new CleanWebpackPlugin({
cleanOnceBeforeBuildPatterns: [path.join(__dirname,'dist/**/*')]
}),new webpack.ProgressPlugin(),new CopyPlugin({
patterns: [
{ from: 'src',to: 'src' },{ from: 'package.json' },{ from: 'README.md' }
],}),],output: {
filename: 'utils.min.js'
},module: {
rules: [
{
test: /\.(ts|tsx)$/,loader: 'ts-loader',include: [path.resolve(__dirname,'src')],exclude: [/node_modules/]
},{
test: /\.m?js$/,exclude: [/node_modules/],use: {
loader: 'babel-loader',options: {
presets: ['@babel/preset-env']
}
}
}]
},resolve: {
extensions: ['.tsx','.ts','.js']
}
}
即使启用了详细选项,我也看不到任何日志,并且插件也不干净。
解决方法
从 webpack v5 开始,您可以删除 clean-webpack-plugin
插件并在 webpack 配置中使用 output.clean 选项:
output: {
filename: 'utils.min.js',clean: true,}
,
显然,当您指定一个选项时。output(在我的情况下,用于自定义输出包名称)clean-webpack-plugin
还需要您指定路径,否则插件将是禁用,没有错误!:
output: {
filename: 'utils.min.js',path: path.resolve(__dirname,'dist')
},
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。