解决 Webpack TypeError: cli.isMultipleCompiler is not a function 报错

最新推荐文章于 2024-06-19 09:03:06 发布
最新推荐文章于 2024-06-19 09:03:06 发布
阅读量3.7k 收藏 4
点赞数 12
CC 4.0 BY-SA版权
分类专栏： webpack 文章标签： webpack 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/broken_promise/article/details/125397502
本文分享了在使用webpack-dev-server搭建开发服务器时遇到的错误，重点介绍了通过更新webpack-cli至4.10.0版本来修复问题的方法，亲测有效的解决方案。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在使用 webpack-dev-server 搭建开发服务器时报错，报错信息如下
在这里插入图片描述
其中使用的版本为
在这里插入图片描述
直接搜索报错，👉Github👈 上说要更新 webpack-cli 至 4.10.0 版本. 亲测有效
在这里插入图片描述

在这里插入图片描述

Vue - Syntax Error: TypeError: this.getOptions is not a function 项目运行时报错，详细解决方案
前端开发大师鸭
11-07 6649
vue2，SyntaxError:TypeError:this.getOptionsisnotafunction，webpack，npmrunserve，报错怎么办，运行报错，runserve时出现报错如何解决，vue2项目运行报错this.getOptionsisnotafunction，vue2怎么解决npmrunserve时的SyntaxError:TypeError:this.getOptionsisnotafunction爆红报错，Vue-Synt
TypeError: compilation.templatesPlugin is not a function - SetVarMainTemplatePlugin.js:17 SetVarM
郭宝的博客
12-03 2857
背景： 在通过 npm run dev 运行Vue 项目时出现了如下错误： ERROR Failed to compile with 1 errors 13:46:13 TypeError: compilation.templatesPlugin is not
【webpack】[webpack-cli] TypeError: cli.isMultipleCompiler is not a function
qq_43746935的博客
05-19 331
[webpack-cli] TypeError: cli.isMultipleCompiler is not a function
解决Webpack TypeError: cli.isMultipleCompiler is not a function报错
qq_54029413的博客
08-27 4944
解决Webpack TypeError: cli.isMultipleCompiler is not a function报错
vue2 TypeError: compiler.plugin is not a function
Dead_Cicle
06-19 629
俩个命令解决：
新安webpack插件后编译报错compiler.plugin is not a function
qq_44308424的博客
02-23 8909
安装使用generate-asset-webpack-plugin时报错TypeError：compiler.plugin is not a function，网上搜索了一下大概就是webpack5与这些插件不匹配。推荐的方法几乎都是换一个适配的插件版本，但我所需要的这个插件在npm上最近更新时间是7年前💔。等不着作者适配于是决定自己改。
webpack5升级：compiler.plugin is not a function编译报错
qq_44242707的博客
10-28 3399
webpack5升级：compiler.plugin is not a function编译报错。webpack5与preload插件不相容
webpack打包css报错（已解决）：UnhandledPromiseRejectionWarning: TypeError: this.getResolve is not a function
qq_45914170的博客
01-07 4625
UnhandledPromiseRejectionWarning错误解决 今天在学习codewhy老师的webpack课程时，安装webpack的loader时，报了下面这些错误 (node:13936) UnhandledPromiseRejectionWarning: TypeError: this.getResolve is not a function at Object.loader (D:\桌面\前端代码\vue\webpack\learnWebpack-01\webpack的配置\no
Syntax Error: TypeError: this.getOptions is not a function
木子聊前端
02-25 8774
场景重现 通过vue-cli搭建一个vue3.0项目，在使用less 的时候报错，依据官方的安装： npm install -D less-loader less 安装的都是最新的 其中less-loader 是今天最新的 8.0.0 版本。 这时候运行 npm run serve 提下如下错误 通常提示 Syntax Error: TypeError: this.getOptions is not a function 提示语法错误都是 版本问题 解决 1，通过降级版本号是最快捷的方法 卸载 les
vuecli3 执行 npm run build 打包命令报错：TypeError: file.split is not a function
学习前端这门手艺，栈底到栈顶依次是：浏览器架构、Web 网络、事件循环机制、JavaScript 核心、V8 的内存管理、浏览器的渲染流程、Web 安全、CSS、React、Vue、Node、构建工具链等
02-04 1221
这样就导致了报错，懒加载多的时候在开启，通过合并的方式处理 chunk，以减少请求数，一个的时候没必要。我排查了一下，模拟代码如下：在打包的时候用了。
关于webpack5 使用 PurifyCSSPlugin 插件去除 多余css 报错TypeError: compiler.plugin is not a function 解决以及原因
m0_48469523的博客
03-20 1万+
关于 webpack5 使用 PurifyCSSPlugin 插件去除 多余css 报错TypeError: compiler.plugin is not a function 解决以及原因
Vue启动报错：TypeError: compilation.templatesPlugin is not a function
just
12-26 5484
项目升级启动报错： TypeError: compilation.templatesPlugin is not a function 原因是版本不兼容 删除 node_modules 重新安装 npm install --registry=https://registry.npm.taobao.org
TypeError: compilation. templatesPlugin is not a function的解决
热门推荐
Java之路的沟沟坎坎
09-12 2万+
TypeError: compilation. templatesPlugin is not a function的解决 原因是因为你的webpack不是最新版本,但是install去下载也不是最新,所以这里我们要手动下载 在百度上找了很多命令都没有用,然后最终大神给命令解决 npm add webpack@latest 如果还没有解决可以删除这个重新install,反正我是这样解决的 前...
webpack4报错compilation.mainTemplate.applyPluginsWaterfall is not a function
sunqy1995的博客
08-29 1万+
最近在进行webpack4的学习，在进行运行的时候出现了一个问题，通过查找资料最终解决，记录一下 html-webpack-plugin 版本不兼容问题 10% building modules 1/1 modules 0 active(node:15332) DeprecationWarning: Tapable.plugin is deprecated. Use new API on...
在使用构建脚本echarts/build/build.js 报TypeError: uglifyPlugin is not a function错误时的解决方法
tbicf的博客
07-24 3192
在node-model目录下找到rollup-plugin-uglify将其中的index.js改为rollup-plugin-uglify.js放到echarts/build目录下
webpack的配置和使用
weixin_51445423的博客
09-15 1740
webpack的配置和使用
使用webpack 打包出错[webpack-cli] TypeError: Cannot read property ‘tap‘ of undefined
hero_th的博客
04-20 6169
刚开始学webpack搭建项目， 跟着B站的视频跟着做，但是总是会遇到一些错误。 此时的 webpack 版本为：4.44.2 html-webpack-plugin 版本为：5.11.0 报错如下图： 错误原因 因为webpack的版本号跟html-webpack-plugin的版本号不匹配，应该算是相互不兼容的原因 就是说我现在webpack的版本号为4，而html-webpack-plugin的版本号是5。然后我在网上看的大佬的报错原因：他的webpack版本是5，然后html-webpack-.
解决react报错 TypeError:_WEBPACK_IMPORTED_MODULE_0_react___default.a.createContext is not a function
Ahuiyo的博客
12-05 1万+
react引用react-redux运行时出现下列报错： TypeError:_WEBPACK_IMPORTED_MODULE_0_react___default.a.createContext is not a function 具体如图： 原因有两种： 与安装的React版本有关。它仅在React版本 > 16.3中可用 react-redux版本更新到6.0以上，版本过高   这...
[webpack-cli] TypeError: compiler.getInfrastructureLogger is not a function【webpack与webpack-cli不兼容】
weixin_46435234的博客
05-16 8132
首先将之前的安装的版本删除 npm uninstall webpack webpack-cli -g //这是全局删除 重新指定版本下载： npm install webpack@4.16.5 webpack-cli@3.3.11 -g
ERROR TypeError: transpileDependencies.map is not a function TypeError: transpileDependencies.map is not a function
最新发布
05-11
<think>嗯，用户遇到了TypeError: transpileDependencies.map is not a function的错误，我需要帮他解决这个问题。首先，这个错误通常发生在Vue项目中，涉及到Webpack的配置。错误信息提到了transpileDependencies.map不是一个函数，所以可能是在尝试对transpileDependencies这个配置项调用map方法时出错了。 我记得在Vue CLI项目中，transpileDependencies应该是一个数组，用来指定需要被Babel转译的依赖包。如果用户错误地将其设置为字符串而不是数组，那么调用map方法自然会失败，因为字符串没有map方法。所以第一步应该检查vue.config.js中的transpileDependencies是否正确配置为数组。 接下来，可能用户没有正确导出配置对象。比如，可能漏掉了module.exports或者写成了其他格式，导致配置没有被正确读取。这时候需要确认配置文件的结构是否正确。 另外，如果用户使用的是较旧版本的Vue CLI，transpileDependencies可能不被支持，或者语法有变化。这时候建议升级Vue CLI和相关依赖，确保版本兼容性。 还有一种可能是用户不小心修改了Webpack的配置，覆盖了默认的transpileDependencies设置，或者错误地引入了其他插件导致冲突。这时候需要检查是否有其他配置干扰，或者是否误用了第三方插件。 综合这些可能性，我应该分步骤引导用户检查配置文件的结构，确认transpileDependencies是否为数组，检查语法是否正确，以及升级依赖版本。同时，给出示例代码和常见解决方案，帮助用户逐步排查问题。此外，引用中的内容虽然涉及React和缓存配置，但可能和当前问题无关，但需要确保回答准确，避免混淆。最后，生成相关问题，帮助用户深入理解类似错误的处理方法。</think>### 解决 `TypeError: transpileDependencies.map is not a function` 错误 该错误通常出现在Vue项目的Webpack配置中，原因是`transpileDependencies`配置项未正确设置为数组格式。以下是逐步解决方案： --- #### 1. **检查 `vue.config.js` 中的配置** 确保`transpileDependencies`被定义为数组类型，且语法正确： ```javascript // vue.config.js module.exports = { transpileDependencies: ["vuex-persist", "lodash-es"], // 必须是数组格式 chainWebpack: (config) => { // 其他Webpack配置 } } ``` **关键点**： - 若设置为字符串（如`transpileDependencies: "vuex-persist"`）会触发此错误，因为字符串没有`.map`方法[^1]。 - 数组元素应为需要Babel转译的依赖包名。 --- #### 2. **验证配置文件的语法** 确认配置文件导出格式正确，避免以下错误： ```javascript // ❌ 错误示例：未正确导出配置对象 transpileDependencies: ["dependency"], module.exports = { /* ... */ } // ✅ 正确示例 module.exports = { transpileDependencies: ["dependency"] } ``` --- #### 3. **升级Vue CLI及相关依赖** 如果使用旧版Vue CLI（如`@vue/cli-service` <4.0），可能因版本不兼容导致解析错误： ```bash npm update @vue/cli-service @vue/babel-preset-app ``` --- #### 4. **检查Webpack配置覆盖** 若手动修改了Webpack配置，需确保未覆盖默认的`transpileDependencies`逻辑： ```javascript // vue.config.js module.exports = { configureWebpack: (config) => { // 避免在此处错误覆盖transpileDependencies return config; } } ``` --- #### 5. **验证依赖包是否需要转译** 仅需转译包含ES6+语法且未预编译的依赖，例如： ```javascript // 需要转译的依赖示例 transpileDependencies: ["vuex-persist", "swiper/vue"] ``` --- ### 常见问题排查 | 场景 | 解决方案 | |-------|----------| | 依赖名拼写错误 | 检查`package.json`中实际安装的依赖名 | | 配置未生效 | 重启开发服务器（`npm run serve`） | | 其他插件冲突 | 注释第三方插件逐步排查 | ---
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值