详解webpack的clean-webpack-plugin插件报错

更新时间：2020年10月16日 14:26:25 作者：ABoyCDog

这篇文章主要介绍了详解webpack的clean-webpack-plugin插件报错，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧

1、出错代码

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

module.exports = {
 entry: './input.js',
 output: {
  path: path.resolve(__dirname, 'dist'),
  filename: 'output.bundle.js'
 },
 mode: 'development',
 plugins: [
  new CleanWebpackPlugin()
 ],
 module: {
  rules: [
   {
    test: /\.(png|jpg|gif)$/i,
    use: [
     {
      loader: 'url-loader',
      options: {
       // limit: 8192 // 说明小于8192字节也就是8k才会执行
       limit: 919200
      }
     }
    ]
   }
  ]
 }
}

2、错误描述

[webpack-cli] TypeError: CleanWebpackPlugin is not a constructor

3、出错原因

导入插件语句有误，以及使用有误

4、解决

应改为如下导入语句：

  const { CleanWebpackPlugin } = require('clean-webpack-plugin')
  
  // es modules
  import { CleanWebpackPlugin} from 'clean-webpack-plugin';

而在使用时也是，如果都是默认清空dist文件下下的内容的话，默认不需要写参数。

和默认删除目录不同时才需要传入路径，且需要通过选项`cleanOnceBeforeBuildPatterns`来传入。

参考【clean-webpack-plugin】

到此这篇关于详解webpack的clean-webpack-plugin插件报错的文章就介绍到这了,更多相关webpack clean-webpack-plugin插件内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

vue 解决uglifyjs-webpack-plugin打包出现报错的问题

js实现将json数组显示前台table中
本文主要介绍了把JSON数组显示在前台的table中的方法。具有一定的参考价值，下面跟着小编一起来看下吧
2017-01-01
JavaScript数字数组的13个实用小技巧
数组是JS最常见的一种数据结构,咱们在开发中也经常用到,在这篇文章中,提供一些小技巧,帮助咱们提高开发效率,这篇文章主要给大家分享介绍了关于JavaScript数字数组的13个实用小技巧,需要的朋友可以参考下
2023-11-11
深入理解javascript严格模式(Strict Mode)
Strict mode是JavaScript1.8.5引进的技术，但还没有浏览器确实可靠的实现了严格模式，所以使用时要小心并且多测试。Strict mode可以应用于整个脚本，也可以适合于单个函数。
2014-11-11
基于JavaScript实现继承机制之原型链(prototype chaining)的详解
我们知道在JavaScript中定义类的原型方式，而原型链扩展了这种方式，以一种有趣的方式实现继承机制。prototype 对象是个模板，要实例化的对象都以这个模板为基础。总而言之，prototype 对象的任何属性和方法都被传递给那个类的所有实例。原型链利用这种功能来实现继承机制
2013-05-05
JavaScript识别网页关键字并进行描红的方法
这篇文章主要介绍了JavaScript识别网页关键字并进行描红的方法,通过字符串的遍历、匹配及动态添加等操作实现识别与描红的功能,非常简单实用,需要的朋友可以参考下
2015-11-11
uni-app登录与支付功能实现三秒后自动跳转
这篇文章主要介绍了uni-app:登录与支付-- 三秒后自动跳转,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2023-03-03
JavaScript实现网页上的浮动广告的简单方法
JavaScript实现网页上的浮动广告的简单方法，需要的朋友可以参考一下
2013-06-06
JS实现的哈夫曼编码示例【原始版与修改版】
这篇文章主要介绍了JS实现的哈夫曼编码,结合实例形式分析了基于JavaScript定义、使用哈夫曼树进行编码、解码等相关操作技巧,需要的朋友可以参考下
2018-04-04
JS双向链表实现与使用方法示例(增加一个previous属性实现)
这篇文章主要介绍了JS双向链表实现与使用方法,在之前链表的基础上增加一个previous属性实现的双向链表功能,需要的朋友可以参考下
2019-01-01
javascript生成大小写字母
本文给大家分享的是javascript生成大写小写字母的代码，十分的简单实用，主要用到了str.charCodeAt()和 String.fromCharCode()方法，有需要的小伙伴可以参考下。
2015-07-07

详解webpack的clean-webpack-plugin插件报错

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具