使用clean-webpack-plugin小插件报错CleanWebpackPlugin is not a constructor

Posted 2020-11-16 浮华夕颜

clean-webpack-plugin是webpack的一个小插件：

由于每次打包的时候有可能文件名称不一样，打包后的文件就叠加到dist目录下了。

所以cleanWebPackPlugin作用就是在每次打包之前，先把dist目录删掉，创建最新的目录，避免一些不必要的文件还留在dist目录下

安装：npm install clean-webpack-plugin -D

正确的使用方法如下：

//引入clean-webpack-plugin的包
const { CleanWebpackPlugin } = require(‘clean-webpack-plugin‘);

//在plugins中配置
plugins: [new CleanWebpackPlugin()]

我在使用过程中碰到错误：TypeError: cleanWebpackPlugin is not a constructor  主要有几点：

1.引入时与之前版本不同，如果还像以前那样用 

const CleanWebpackPlugin = require(‘clean-webpack-plugin‘); 是会报错的。

2.配置时不能传参数，在最新版的webpack中 new CleanWebpackPlugin()；中不需要写里面的目标路径，会自动清除生成的文件夹，比如是dist文件夹，如果加上了目标路径（如：new CleanWebpackPlugin(‘./dist‘)）则会报错。

3.这个问题很奇怪，由于是我个人习惯原因，我在引入的时候第一个字母会小写，如

const { cleanWebpackPlugin } = require(‘clean-webpack-plugin‘);

但是这样也会引起错误。