clean-webpack-plugin 3.0.0版报错，TypeError: CleanWebpackPlugin is not a constructor

// "clean-webpack-plugin": "^3.0.0"

//报错时配置

const CleanWebpackPlugin = require('clean-webpack-plugin')

module.exports = {
    ...
    plugins: [
            new CleanWebpackPlugin()
    ]
}

运行时报错：

æ¥é

问题排查：

错误日志中我们可以了解到CleanWebpackPlugin不是一个构造函数，用ctrl+鼠标右键点击require('clean-webpack-plugin')去查看一下我们引入的文件，自动打开clean-webpack-plugin.d.ts文件，如下：

.d.tsæä»¶

由于导出的是以一个对象属性的形式，所以我们在引入的时候需要以解构的方式来获取，如下：

const { CleanWebpackPlugin } = require('clean-webpack-plugin')

module.exports = {
    ...
    plugins: [
            new CleanWebpackPlugin()
    ]
}

这时再运行，结果正常

在dist文件夹下该清理的都清理了

注意

新版的引用方式已改成 const { CleanWebpackPlugin } = require('clean-webpack-plugin');如果继续使用旧版引用方式，会报 “CleanWebpackPlugin is not a constructor ” 错误