解决webpack5下使用webpack-dev-server报错

最新推荐文章于 2024-03-29 23:23:25 发布
原创 最新推荐文章于 2024-03-29 23:23:25 发布 · 5.8k 阅读 · 18 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#webpack

在使用webpack 5.4.0、webpack-cli 4.2.0和webpack-dev-server 3.11.0时遇到Error: Cannot find module 'webpack-cli/bin/config-yargs'错误。两种解决方法是：将webpack-cli版本回退到3.3.12或者使用命令'npx webpack serve'启动服务。

先说下我使用的版本
"webpack": "^5.4.0",
"webpack-cli": "^4.2.0",
"webpack-dev-server": "^3.11.0"

使用 npx webpack-dev-server 运行会报Error: Cannot find module 'webpack-cli/bin/config-yargs'这样的错误。

解决方法一：
webpack-cli的版本降为3.3.12

解决方法二：
使用npx webpack serve这个命令运行。

解决webpack5.0以上版本使用webpack-dev-server报错问题
Lloveyy的博客
08-05 1436
解决webpack5.0以上版本使用webpack-dev-server报错问题 webpage、webpack-dev-server、webpack-cli的版本如下： { "webpack": "^5.48.0", "webpack-dev-server": "^3.11.2", "webpack-cli": "^4.7.2" }, 配置webpack.config.js devServer: { port: 8080, contentBa
解决 webpack-dev-server --inline --progress --config buildwebpack.dev.conf.js 报错
Ajekseg的博客
03-07 1545
解决 webpack-dev-server --inline --progress --config build/webpack.dev.conf.js 报错 目前存在这种情况，可能是三个原因造成的 1.webpack版本与vue版本不一致 2.本地运行IP地址不正确 3.本地运行localhost与127.0.0.1映射被修改 1.webpack版本与vue版本不一致 查看vue版本 vue -V 2.9.6 卸载、安装对应版本webpack npm uninstall webpack-de
webpack 之 webpack5 webpack-dev-server 版本兼容问题
shenjing_Shining的博客
11-11 4877
在写
webpack5.x下使用webpack-dev-server报错
Xv威的博客
11-20 4883
webpack5.x踩坑记录–webpack-dev-server 在我学习webpack5.x的时候，安装webpack-dev-server的时候，碰到安装webpack-dev-server安装不上的情况，即使直接在packsge.json里面直接添加相应的插件然后npm install也是不可以的，报错信息 webpack-sev-server --inline --progress --config build/webpack.dev.conf.js 经过多方查找，发现是webpack版本过高的
webpack5.x热模块更新之webpack-dev-server不兼容问题
派大星球
08-25 1299
8.vi-vim-终端编辑器 8.1.vi简介 8.1.1.使用vi的目的 在工作中，要对服务器上的文件进行键的修改，可以使用ssh远程登录到服务器上，并使用vi进行快速的编辑即可 常见的需要修改的文件包括： ·源程序 ·配置文件，例如ssh的配置文件~/.ssh/config ·在没有图形见面的环境下，要编辑文件，vi是最佳选择 ·每一个要是用Linux的程序员，都必须或多或少的学习一下vi编辑的常用命令 8.1.2.vi和vim 在很多Linux发行版中，直接吧vi做成vim的软链接 vi 是Visua
webpack-dev-server插件兼容问题：Error: Cannot find module ‘webpack-cli/bin/config-yargs‘
u011296285的博客
11-20 819
在webpack中使用webpack-dev-server插件，遇到的问题：Error: Cannot find module 'webpack-cli/bin/config-yargs' 问题解决参考：Error: Cannot find module 'webpack-cli/bin/config-yargs' #1948 If you upgrade webpack to 5. *, and webpack cli to 4. *, an error will be reported: ..
webpack5使用webpack-dev-server
qq_41391628的博客
05-30 602
使用webpack5之后，发现原先的dev-server不好使了，报错 Cannot find module 'webpack-cli/bin/config-yargs'
【webpack5】webpack-dev-server 不能正常启动
小笼包不是包的博客
01-29 3212
【webpack5】webpack-dev-server 不能正常启动 一、问题 webpack-dev-server --open --config script/webpack.dev.js webpack4环境下可以正常启动，但是升级webpack5后依赖都要升级，再跑这个指令就会报错： internal/modules/cjs/loader.js:584 throw err; ^ Error: Cannot find module 'webpack-cli/bin/confi
Vue启动项目报错travel@1.0.0 dev: `webpack-dev-server--inline --progress --config build/webpack.dev.conf.js
热门推荐
我能在河边钓一整天的鱼
12-09 1万+
问题原因 出现在webpack上。如想了解webpack请走官网，如果想了解webpack里面的文件结构，下面推荐一篇博客 https://blog.csdn.net/shan1991fei/article/details/82630656 解决方案 这个东西我没有深入研究原理，只是用一种办法解决了问题。 <1>卸载你项目中的webpac...
解决vue项目 改东西则项目中断 报错（内存溢出）​`webpack-dev-server --inline --progress --config build/webpack.dev.conf.j
w1939459的博客
10-13 1666
解决vue项目 改东西则项目中断 报错（内存溢出）​`webpack-dev-server --inline --progress --config build/webpack.dev.conf.j
5.0 webpack devServer
最新发布
weixin_44472131的博客
03-29 504
虽然作为一个前端已经耕耘此行业有三五个年头，但都是在业务中未曾精进，怀着初心，重识Webpack，砥砺前行💪#开发服务器devserver ：用来自动化（自动编译，自动打开浏览器，自动刷新浏览器）启动指令： npx webpack-dev-server。
webpack5跑webpack-dev-server的时候报错Error: Automatic publicPath is not supported in this browser的解决方案
YanGo的博客
10-27 1860
最近跟着B站大佬视频学习webpack5手动配置webpack构建工具，遇到了这个问题。 问题描述： 在使用webpack-dev-server本地服务的时候，则报错Error: Automatic publicPath is not supported in this browser，如下图 各个工具版本 webpack @5.1.3 webpack-cli @4.0.0 node @10.11.0 报错原因分析: 首先我webpack打包出来后运行的html没有报错的。然后当我修改url-load
webpack5 + webpack-dev-server
S_SL_rule的博客
11-27 578
学习webpack中出这种错误： internal/modules/cjs/loader.js:834 throw err; ^ Error: Cannot find module 'webpack-cli/bin/config-yargs' Require stack: 原因在于webpack-cli升级到4之后，文件结构发生了变化，会与webpack-dev-server@3.*.*产生不兼容的现象，而如果将webpack-cli版本降下来之后又会导致webpack5打包出bug。 .
webpack5下使用webpack-dev-server不能正常启动
Gemini_Kanon的博客
03-04 3731
报错：Error: Cannot find module 'webpack-cli/bin/config-yargs' 开始以为是版本问题，我用的版本是："webpack": "^5.24.3"、"webpack-cli": "^4.5.0"、"webpack-dev-server": "^3.11.2" 于是乎开始疯狂卸载webpack和webpack-dev-server版本，重装低版本，还是不管用 知道遇到了这位老哥的博客：【webpack5】webpack-dev-server 不能正常启动，
webpack webpack-dev-serve 报错处理
c_liufeng的博客
11-30 1129
错误情况： Cannot find module 'webpack-cli/bin/config-yargs' 错误分析： 出现这种情况一般是因为webpck与webpack-dev-serve版本不兼容引起的错误。 解决方案： 运行 npm uninstall webpck webpack-dev-server webpck-cli -D先删除架包，之后运行npm install webpack webpck-dev-server webpack-cli -D 重新安装架包。（如果此方法无用，建议寻
webpack5.X使用webpack-dev-server
weixin_45047039的博客
11-28 7955
webpack5.X使用webpack-dev-server启动服务器一、安装使用二、配置选项 https://webpack.js.org/guides/development-vagrant/ 一、安装使用 yarn add webpack-dev-server --dev 启动服务器 yarn webpack serve 因为webpack5.X与webpack-dev-server有些冲突，无法直接使用webpack-dev-server启动服务，只能通过这种方式去调用webpack-dev-s
webpack安装 webpack-dev-server后运行报错
qq_44696583的博客
12-12 2939
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎使用Markdown编辑器 你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
webpack 5 与 webpack-dev-server 3兼容性问题
xm1037782843的博客
06-28 911
说明：这里使用的是webpack: "^5.9.0",webpack-cli: "^4.2.0",webpack-dev-server: "^3.11.0" 问题： 通过 webpack-dev-server 启动项目失败，报错：Error: Cannot find module 'webpack-cli/bin/config-yargs' 解决办法： 使用webpack serve --open命令启动，这里需要注意，执行后会提示缺少打开对象, 所以在ope...
webpack-dev-server 配置以及webpack教程
weixin_40254430的博客
02-09 5047
webpack是什么? 一开始我也不理解? 看了许多文档都是在扯淡，摞了一大堆,点子却没说到。当然我说的可能也不对，希望诸位取其精华，去其糟粕。 因为包括官方文档，虽然翻译说的是人话，但是你却找不出一点点有用的有效的信息。 至于其他人的就是罗里吧嗦一大堆。写这个，就是想说，这玩意其实很简单。包括在php上，就是php的blade指令。不过php是直接略过了。压根没当回事。是因为什么被搞复杂了。是因为每个人的思维不透明。才造成交流沟通的困难。我这里写这个就是希望可以帮助到大家。 webpack其实就两个关.
webpack-dev-server --progress --config
08-23
webpack-dev-server --progress --config是一个命令，用于启动webpack开发服务器并显示进度。根据引用和引用的信息，出现报错的原因可能是webpack-dev-server的版本不兼容。解决这个问题的方法有两种： 1. 方法一：删除node_modules目录，然后重新安装依赖包npm install -S。这个方法比较费时间，但可以确保安装的是最新版本的webpack-dev-server。 2. 方法二：先卸载当前的webpack-dev-server，通过指令npm uninstall webpack-dev-server，然后再使用指令npm install webpack-dev-server@2.9.7（或者其他合适的低版本）来安装特定版本的webpack-dev-server。这个方法可以解决版本不兼容的问题。 综上所述，你可以选择其中一种方法来解决报错问题。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [webpack-dev-server --inline --progress --config build/webpack.dev.conf.js 解决办法](https://blog.csdn.net/sinat_35441683/article/details/121692857)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [npm报错`webpack-dev-server --inline --progress --config build/webpack.dev.conf.js`](https://blog.csdn.net/GongWei_/article/details/107907911)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值