详解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插件内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 基于javascript的异步编程实例详解

    基于javascript的异步编程实例详解

    这篇文章主要介绍了基于javascript的异步编程,结合实例形式分析了javascript异步编程的原理、实现技巧与相关注意事项,需要的朋友可以参考下
    2017-04-04
  • 详解TypeScript中type与interface的区别

    详解TypeScript中type与interface的区别

    在写 ts 相关代码的过程中,总能看到 interface 和 type 的身影。它们的作用好像都一样的,相同的功能用哪一个都可以实现,也都很好用,所以也很少去真正的理解它们之间到底有啥区别,因此本文将详细讲解二者的区别,需要的可以参考一下
    2022-04-04
  • JS仿hao123导航页面图片轮播效果

    JS仿hao123导航页面图片轮播效果

    这篇文章主要介绍了JS仿hao123导航页面图片轮播效果,代码简单易懂,非常不错,具有参考借鉴价值,感兴趣的朋友一起学习吧
    2016-09-09
  • 使用自定义setTimeout和setInterval使之可以传递参数和对象参数

    使用自定义setTimeout和setInterval使之可以传递参数和对象参数

    该函数兼容ie,firefox。并且可以使用clearSetTimeOut和clearInterval清除,比原setTimeout,setInterval方便很多,并且参数可以是object。
    2009-04-04
  • 深入浅析JavaScript中的scrollTop

    深入浅析JavaScript中的scrollTop

    这篇文章主要介绍了深入浅析JavaScript中的scrollTop的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-07-07
  • JavaScript使用canvas实现flappy bird全流程详解

    JavaScript使用canvas实现flappy bird全流程详解

    这篇文章主要介绍了JavaScript使用canvas实现flappy bird流程,canvas是HTML5提供的一种新标签,它可以支持JavaScript在上面绘画,控制每一个像素,它经常被用来制作小游戏,接下来我将用它来模仿制作一款叫flappy bird的小游戏
    2023-03-03
  • 浅谈目前可以使用ES10的5个新特性

    浅谈目前可以使用ES10的5个新特性

    这篇文章主要介绍了浅谈目前可以使用ES10的5个新特性,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-06-06
  • 如何在CocosCreator中做一个List

    如何在CocosCreator中做一个List

    这篇文章主要介绍了如何在CocosCreator中做一个List,对List列表感兴趣的同学,不妨来试验一下
    2021-04-04
  • 微信小程序点击保存图片到本机功能

    微信小程序点击保存图片到本机功能

    这篇文章主要介绍了微信小程序点击保存图片到本机功能,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-12-12
  • JavaScript中双叹号!!作用示例介绍

    JavaScript中双叹号!!作用示例介绍

    !!一般用来将后面的表达式强制转换为布尔类型的数据,因为javascript是弱类型的语言,所以有时需要强制转换为相应的类型
    2014-09-09

最新评论