TypeError: cleanWebpackPlugin is not a constructor问题解决办法

最新推荐文章于 2023-02-04 21:10:44 发布
原创 最新推荐文章于 2023-02-04 21:10:44 发布 · 918 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#webpack #plugin

在使用webpack进行项目打包时，遇到一个常见的错误：`TypeError: cleanWebpackPlugin is not a constructor`。这个错误通常是由于导入和实例化CleanWebpackPlugin时的语法错误导致的。解决方法是确保在配置文件中正确地使用解构赋值，并且注意Clean的首字母需大写，即`CleanWebpackPlugin`。遵循这一修改后，项目就能成功打包。

命令窗口报错：

TypeError: cleanWebpackPlugin is not a constructor

报错原因：

不能用习惯写法来写，cleanWebpackPlugin不是一个构造函数

解决办法：

在配置文件中定义的变量要用解构赋值，Clean的C要大写

此时打包就可以打包成功

TypeError: cleanWebpackPlugin is not a constructor 问题已解决
weixin_55242897的博客
02-28 1240
项目场景 const path = require('path') const htmlWebpackPlugin = require('html-webpack-plugin') //导入每次删除文件夹的插件 //此下一行为错误引用，{ CleanWebpackPlugin }为固定导入法，引用时用new CleanWebpackPlugin() //const cleanWebpackPlugin = require('clean-webpack-plugin') const { CleanWebpa
TypeError: CleanWebpackPlugin is not a constructor
benben的博客
07-19 2919
引起错误的代码 const path = require('path'); const CleanWebpackPlugin = require('clean-webpack-plugin'); module.exports = { entry : { app : './src/index.js', print: './src/print.js' ...
TypeError: CleanWebpackPlugin is not a constructor 的错误处理
码飞_CC的博客
11-25 8071
遇到问题 按照webpack官网的教程进行学习时，安装clean-webpack-plugin插件后（版本为："^3.0.0"），再build时，发现报错了，配置如下： const CleanWebpackPlugin = require('clean-webpack-plugin') module.exports = { ... plugins: [ new C...
使用clean-webpack-plugin小插件报错CleanWebpackPlugin is not a constructor
weixin_51225684的博客
09-27 1397
2.配置时不能传参数，在最新版的webpack中 new CleanWebpackPlugin()；中不需要写里面的目标路径，会自动清除生成的文件夹，比如是dist文件夹，如果加上了目标路径。3.这个问题很奇怪，由于是我个人习惯原因，我在引入的时候第一个字母会小写，1.引入时与之前版本不同，如果还像以前那样用。
【webpack】打包出现TypeError: cleanWebpackPlugin is not a constructor 报错处理
徐海东的博客
02-04 1202
打包出现TypeError: cleanWebpackPlugin is not a constructor 报错处理
webpack 使用 clear-webpack-plugin 报错 ClearWebpackPlugin is not a constructor
重新开始
07-18 791
学习webpack配置时，发现clear-webpack-plugin的配置运行会报错 下面是官网使用clear-webpack-plugin的配置 运行后报错 从报错原因看，ClearWebpackPlugin 不是一个构造函数，应该是插件做了更新，但文档没更新，改成如下配置，就可以了 ...
clean-webpack-plugin插件的CleanWebpackPlugin is not a constructor报错解决方法
weixin_46246967的博客
10-20 140
clean-webpack-plugin插件的CleanWebpackPlugin is not a constructor报错解决方法
TypeError: webpack.optimize.OccurenceOrderPlugin is not a constructor
03-19
当出现 `TypeError: webpack.optimize.OccurenceOrderPlugin is not a constructor` 时，通常与以下原因相关： 1. **Webpack 版本升级**：Webpack 4+ 已弃用 `OccurenceOrderPlugin`，直接使用会导致语法不兼容[^4]...
TypeError: s is not a constructor at t.exports (mqtt.js:1) at u (mqtt.js:1) at Object.t.exports (mqtt.js:1) at v.streamBuilder (mqtt.js:1) at v._setupStream (mqtt.js:1) at new v (mqtt.js:1) at c (mqtt.js:1) at li.onShow (index.js? [sm]:110) at li.<anonymous> (WASubContext.js?t=wechat&s=1741609820136&v=3.7.10:1) at li.c.__callPageLifeTime__ (WASubContext.js?t=wechat&s=1741609820136&v=3.7.10:1)(env: Windows,mp,1.06.2412050; lib: 3.7.10)
03-11
类似错误如“WebSocket is not a constructor”[^1]、“cleanWebpackPlugin is not a constructor”[^2]、“Vue is not a constructor”[^3]以及“c is not a constructor”[^4]通常与构造器相关的问题有关。...
app.js ReferenceError:require is not defined
06-27
特别是当出现类似 `TypeError: CleanWebpackPlugin is not a constructor` 的错误时，应确保插件版本与 Webpack 兼容，并正确导入插件[^2]。 #### 4. 避免在浏览器中使用 require 如果不需要复杂的打包流程，可以...
webpack插件使用报错：CleanWebpackPlugin is not a constructor
H_xiang_xiang的博客
06-21 360
用 clean-webpack-plugin 插件，在每次发布之前先把dist老文件清空 npm install -D clean-webpack-plugin package.json 简化打包指令 “scripts”:{ "pub": "webpack --config webpack.publish.config.js" } webpack.publish.config.js 错误配置 const CleanWebpackPlugin = require('clean-webpack-plug
配置自动打包报错 TypeError: cleanWebpackPlugin is not a constructor
MAMRHY的博客
07-12 169
配置自动打包报错 TypeError: cleanWebpackPlugin is not a constructor 这里require(‘clean-webpack-plugin’)引入的是一个类 所以变量名首字母一定要大写 #记录学习过程的报错。。。
Webpack 打包运行时 报错：CleanWebpackPlugin is not a constructor
TobEABetterMan_的博客
02-21 579
问题描述： 在webpack 进行打包过程中，cmd报错，打包失败原因是CleanWebpackPlugin is not a constructor， 原写法是，webpack@4 版本中的: const CleanWebpackPlugin = require('clean-webpack-plugin') plugins:[new CleanWebpackPlugin(['dist'])] 原因分析及解决： 随着webpack@5发布 ，舍弃掉这种写法，而是采用长得像es6解构赋值一样的：
webpack报错, CleanWebpackPlugin is not a constructor
业余前端的职业经历
11-07 746
如果同学 按照webpack官方文档里面学习 按着步骤 走 走到那个 清除dist多余的文件 可能会报这个错误 那是因为官方已经更新 但是中文文档还是没有更新 新版采用对象结构的方式进行获取 而且不需要再往里面传参数了 ...
CleanWebpackPlugin is not a constructor 安装clean-webpack-plugin报错
qq_39882537的博客
03-25 229
使用插件 clean-webpack-plugin 时候报错 CleanWebpackPlugin is not a constructor 注意引用插件版本问题，版本太高也不行，“clean-webpack-plugin”: “^2.0.2” 大小写问题 开头C要大写，养成习惯插件开头大写，变量开头小写 CleanWebpackPlugin 参数问题，new CleanWebpackPlugi...
webpack 升级报错 webpack.NamedModulesPlugin is not a constructor
从零开始的Rem486
10-14 7160
使用 webpack@5.58.1 的时候报错：TypeError: webpack.NamedModulesPlugin is not a constructor 配置文件如下，webpack.config.js： const webpack = require('webpack'); const { merge } = require('webpack-merge'); const baseConfig = require('./webpack.config.base'); module.expor
webpack5.27：UglifyJsPlugin、webpack-merge、html-webpack-plugin报错解决--《Vue.js实战》采坑
成长之路
03-28 3602
前言 博主最近在看《Vue.js实战》(梁灏著，2017年10月01日出版)，学习vue框架和webpack编译打包。在进行npm run build编译生产环境包时，出现了很多报错，特此记录采坑和解决方案 一. 问题背景 书中首先创建webpack.prod.config.js文件，如下 var webpack = require('webpack'); var HtmlwebpackPlugin = require('html-webpack-plugin'); var ExtractTextPlugi
Uncaught in promise typeError: Clz is not a constructor
最新发布
10-11
`Uncaught in promise TypeError: Clz is not a constructor` 错误通常意味着在 Promise 内部尝试将一个非构造函数的值作为构造函数来使用。以下是一些可能的解决方法： #### 检查构造函数的引入和定义 确保 `Clz` 被正确定义和引入。如果是从其他模块引入的，检查引入路径和引入名是否正确。 ```javascript // 示例：正确引入构造函数 import Clz from './path/to/Clz'; async function someAsyncFunction() { try { const instance = new Clz(); // 其他逻辑 } catch (error) { console.error(error); } } someAsyncFunction(); ``` #### 检查变量赋值 确保 `Clz` 没有被意外赋值为非构造函数类型的值。可以在使用前进行类型检查。 ```javascript // 示例：类型检查 let Clz; // 假设这里有赋值操作 Clz = 'not a constructor'; async function someAsyncFunction() { if (typeof Clz === 'function') { const instance = new Clz(); // 其他逻辑 } else { console.error('Clz is not a constructor'); } } someAsyncFunction(); ``` #### 调试和日志输出 在出现错误的位置添加日志输出，查看 `Clz` 的实际值。 ```javascript async function someAsyncFunction() { console.log('Clz value:', Clz); try { const instance = new Clz(); // 其他逻辑 } catch (error) { console.error(error); } } someAsyncFunction(); ``` #### 检查异步加载 如果 `Clz` 是通过异步加载获取的，确保在使用之前已经加载完成。 ```javascript // 示例：异步加载模块 async function loadModule() { const { Clz } = await import('./path/to/Clz'); if (typeof Clz === 'function') { const instance = new Clz(); // 其他逻辑 } else { console.error('Clz is not a constructor'); } } loadModule(); ```
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值