webpack 中 cleanWebpackplugin 升级踩坑

时间 2019-11-29 标签 webpack 中 cleanwebpackplugin 升级踩坑

新版的clean-webpack-plugin 作了如下调整webpack

1.导出方式

如今不是默认导出，因此引入的时候须要注意一下～不然会抛出这样一个异常web

TypeError: CleanWebpackPlugin is not a constructor

#错误，以前的引入方式
const CleanWebpackPlugin = require('clean-webpack-plugin');

# 正确的，引用的时候须要用对象解构
const { CleanWebpackPlugin } = require('clean-webpack-plugin');复制代码

2.构造方法

如今构造函数须要传入一个对象不然会抛出异常数组

Error: clean-webpack-plugin only accepts an options object.

# 之前这样传入参数，如今不行咯～
new CleanWebpackPlugin(['dist'], {}),

# 直接不传也是能够的，他会取默认值
# 默认是在output中设置的输出文件
new CleanWebpackPlugin()

# 也能够经过对象的方式传参 , 必须是数组，且必须加上"**/*"通配符
new CleanWebpackPlugin({
    cleanOnceBeforeBuildPatterns: ["**/*", './dist'],
})复制代码

3.官网配置解释翻译

new CleanWebpackPlugin({

#默认false dry为true时，模拟删除，加删除，不会真的删掉文件dry: false,

# 默认false verbose为true时 显示日志， 当dry为true时，老是会打印日志，无论verbose是什么值verbose :false, 

#自动删除未被使用的webpack资源cleanStaleWebpackAssets:true 

#cleanOnceBeforeBuildPatterns打包前作的一些事，

#忽略掉不须要删除的文件，至关于exclude,被忽略的文件须要在开头加上 "!"号，数组中必须带有"**/*"通配符

#不然dist下的文件都不会被删除

# 删除指定文件/文件夹 path.resolve(__dirname, 'test6')

cleanOnceBeforeBuildPatterns: ["**/*",path.resolve(__dirname, 'test6'), "!1.js", "!images"],

})复制代码