詳解webpack的clean-webpack-plugin插件報(bào)錯(cuò)

更新時(shí)間：2020年10月16日 14:26:25 作者：ABoyCDog

這篇文章主要介紹了詳解webpack的clean-webpack-plugin插件報(bào)錯(cuò)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

1、出錯(cuò)代碼

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字節(jié)也就是8k才會(huì)執(zhí)行
       limit: 919200
      }
     }
    ]
   }
  ]
 }
}

2、錯(cuò)誤描述

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

3、出錯(cuò)原因

導(dǎo)入插件語句有誤，以及使用有誤

4、解決

應(yīng)改為如下導(dǎo)入語句：

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

而在使用時(shí)也是，如果都是默認(rèn)清空dist文件下下的內(nèi)容的話，默認(rèn)不需要寫參數(shù)。

和默認(rèn)刪除目錄不同時(shí)才需要傳入路徑，且需要通過選項(xiàng)`cleanOnceBeforeBuildPatterns`來傳入。

參考【clean-webpack-plugin】

到此這篇關(guān)于詳解webpack的clean-webpack-plugin插件報(bào)錯(cuò)的文章就介紹到這了,更多相關(guān)webpack clean-webpack-plugin插件內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

vue 解決uglifyjs-webpack-plugin打包出現(xiàn)報(bào)錯(cuò)的問題

相關(guān)文章

js實(shí)現(xiàn)將json數(shù)組顯示前臺(tái)table中
本文主要介紹了把JSON數(shù)組顯示在前臺(tái)的table中的方法。具有一定的參考價(jià)值，下面跟著小編一起來看下吧
2017-01-01
JavaScript數(shù)字?jǐn)?shù)組的13個(gè)實(shí)用小技巧
數(shù)組是JS最常見的一種數(shù)據(jù)結(jié)構(gòu),咱們?cè)陂_發(fā)中也經(jīng)常用到,在這篇文章中,提供一些小技巧,幫助咱們提高開發(fā)效率,這篇文章主要給大家分享介紹了關(guān)于JavaScript數(shù)字?jǐn)?shù)組的13個(gè)實(shí)用小技巧,需要的朋友可以參考下
2023-11-11
深入理解javascript嚴(yán)格模式(Strict Mode)
Strict mode是JavaScript1.8.5引進(jìn)的技術(shù)，但還沒有瀏覽器確實(shí)可靠的實(shí)現(xiàn)了嚴(yán)格模式，所以使用時(shí)要小心并且多測(cè)試。Strict mode可以應(yīng)用于整個(gè)腳本，也可以適合于單個(gè)函數(shù)。
2014-11-11
基于JavaScript實(shí)現(xiàn)繼承機(jī)制之原型鏈(prototype chaining)的詳解
我們知道在JavaScript中定義類的原型方式，而原型鏈擴(kuò)展了這種方式，以一種有趣的方式實(shí)現(xiàn)繼承機(jī)制。prototype 對(duì)象是個(gè)模板，要實(shí)例化的對(duì)象都以這個(gè)模板為基礎(chǔ)?？偠灾?，prototype 對(duì)象的任何屬性和方法都被傳遞給那個(gè)類的所有實(shí)例。原型鏈利用這種功能來實(shí)現(xiàn)繼承機(jī)制
2013-05-05
JavaScript識(shí)別網(wǎng)頁關(guān)鍵字并進(jìn)行描紅的方法
這篇文章主要介紹了JavaScript識(shí)別網(wǎng)頁關(guān)鍵字并進(jìn)行描紅的方法,通過字符串的遍歷、匹配及動(dòng)態(tài)添加等操作實(shí)現(xiàn)識(shí)別與描紅的功能,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下
2015-11-11
uni-app登錄與支付功能實(shí)現(xiàn)三秒后自動(dòng)跳轉(zhuǎn)
這篇文章主要介紹了uni-app:登錄與支付-- 三秒后自動(dòng)跳轉(zhuǎn),本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2023-03-03
JavaScript實(shí)現(xiàn)網(wǎng)頁上的浮動(dòng)廣告的簡(jiǎn)單方法
JavaScript實(shí)現(xiàn)網(wǎng)頁上的浮動(dòng)廣告的簡(jiǎn)單方法，需要的朋友可以參考一下
2013-06-06
JS實(shí)現(xiàn)的哈夫曼編碼示例【原始版與修改版】
這篇文章主要介紹了JS實(shí)現(xiàn)的哈夫曼編碼,結(jié)合實(shí)例形式分析了基于JavaScript定義、使用哈夫曼樹進(jìn)行編碼、解碼等相關(guān)操作技巧,需要的朋友可以參考下
2018-04-04
JS雙向鏈表實(shí)現(xiàn)與使用方法示例(增加一個(gè)previous屬性實(shí)現(xiàn))
這篇文章主要介紹了JS雙向鏈表實(shí)現(xiàn)與使用方法,在之前鏈表的基礎(chǔ)上增加一個(gè)previous屬性實(shí)現(xiàn)的雙向鏈表功能,需要的朋友可以參考下
2019-01-01
javascript生成大小寫字母
本文給大家分享的是javascript生成大寫小寫字母的代碼，十分的簡(jiǎn)單實(shí)用，主要用到了str.charCodeAt()和 String.fromCharCode()方法，有需要的小伙伴可以參考下。
2015-07-07