输入指令npx webpack-dev-server报错:Error: Cannot find module ‘webpack-cli/bin/config-yargs‘的解决方法

输入指令:npx webpack-dev-server显示如下报错信息:

C:\Users\ASUS\Desktop\JavaScript 代码\webpack实验>npx webpack-dev-server
internal/modules/cjs/loader.js:983
throw err;
^ Error: Cannot find module 'webpack-cli/bin/config-yargs'
Require stack:
- C:\Users\ASUS\Desktop\JavaScript 代码\webpack实验\node_modules\webpack-dev-server\bin\webpack-dev-server.js
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:980:15)
at Function.Module._load (internal/modules/cjs/loader.js:862:27)
at Module.require (internal/modules/cjs/loader.js:1042:19)
at require (internal/modules/cjs/helpers.js:77:18)
at Object.<anonymous> (C:\Users\ASUS\Desktop\JavaScript 代码\webpack实验\node_modules\webpack-dev-server\bin\webpack-dev-server.js:65:1)
at Module._compile (internal/modules/cjs/loader.js:1156:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)
at Module.load (internal/modules/cjs/loader.js:1000:32)
at Function.Module._load (internal/modules/cjs/loader.js:899:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'C:\\Users\\ASUS\\Desktop\\JavaScript 代码\\webpack实验\\node_modules\\webpack-dev-server\\bin\\webpack-dev-server.js'
]
}

原因:webpack现在存在一个bug,最新版的webpack-dev-server 和最新版的webpack-cli 并不兼容。
解决办法:
打开package.json,查看依赖包的版本:

{
"name": "test",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"dependencies": {},
"devDependencies": {
"css-loader": "^5.0.1",
"html-webpack-plugin": "^4.5.1",
"style-loader": "^2.0.0",
"webpack": "^5.16.0",
"webpack-cli": "^4.4.0",
"webpack-dev-server": "^3.11.2"
}
}

重新下载webpack-cli正确的版本。(“webpack-cli”: “^3.3.12”,和
“webpack-dev-server”: "^3.11.2"是互相兼容的,报错之前的版本是webpack-cli 4.4.0)

如果你找不到与webpack-dev-server兼容的webpack-cli版本号,可以去node_modules中的webpack-dev-server/bin/webpack-dev-server.js代码中寻找webpack-dev-server依赖webpack-cli的版本号。

输入指令npx webpack-dev-server报错:Error: Cannot find module ‘webpack-cli/bin/config-yargs‘的解决方法的更多相关文章

  1. 全局安装的 webpack运行时 报错 Error: Cannot find module 'webpack' ......

    全局安装的webpack   安装指令如下 cnpm install wepack -save-dev -g 但是 在我的项目空间运行webpack指令的时候 会报如下错误 为了方便抓取{ Error ...

  2. LR报错Error -27780: [GENERAL_MSG_CAT_SSL_ERROR]connect to host "XXX.XXX.com" failed解决方法

  3. inoic start projectname sidemenu报错 - Error: Cannot find module 'lodash._baseslice'

    inoic start projectname sidemenu报错 - Error: Cannot find module 'lodash._baseslice' 在公司的电脑上出现过这个错误,后来 ...

  4. webpack编译sass报错找不到module /css-loader/index.js... || 安装node-sass报错

    今天无论在家还是在公司,安装node-sass总是失败,或安装成功了,使用webpack编译sass报错,说找不到module,按照提示的错误我找了node_modules下的css-loader,发 ...

  5. npm run dev报错--Error: Cannot find module 'yargs-parser'

    Error: Cannot find module 'yargs-parser'  ---报错不知何解??? 百度了很久没找到方法,是缺少“ yargs-parser ”模块,需要安装一下即可:cnp ...

  6. vue报错-Error: Cannot find module '@babel/core'

    vue之webpack实战的时候遇到报错,Error: Cannot find module '@babel/core' 这报错,我百度了很久,后来发现报错里面有提示,发现是我的 babel-load ...

  7. ehcache报错ERROR n.s.e.store.disk.DiskStorageFactory - Disk Write的解决办法

    23:53:44 ERROR n.s.e.store.disk.DiskStorageFactory - Disk Write of com.koal.**.**.**.**.**.***Impl$$ ...

  8. Nginx报错 connect() failed (111: Connection refused) while connecting to upstream 的解决方法

    今天访问公司的网站突然报错,抛出一些英文,提示看一下Nginx的error.log日志: cd  /usr/local/nginx/logs/  看到了error.log ,下一步 tail -n 2 ...

  9. mongodb安装及安装MongoDB报错Verify that you have sufficient privileges to start system services解决方法

    1.点击安装包mongodb-win32-x86_64-2012plus-4.2.2-signed进行安装 2.点击next 3.接受协议,点击next 4.点击自定义安装 选择安装路径,建议默认C盘 ...

  10. ubuntu 修改保存报错E37:No write since last change(add ! to override)的解决方法

    报错信息如下: E37: No write since last change (add ! to override) 解决办法是: 在修改完后,将命令 :q 改成 :wq 即可.

随机推荐

  1. IdentityServer4[1]:开篇

    1.开篇 首先明确一点,文章只是学习过程的笔记,参考目前网络上的博客,主要便于自己加深理解,同时也督促自己持续学习,没有其他目的.感谢网上资源的提供者. IdentityServer是为ASP.NET ...

  2. Mybatis逆向工程和新版本MybatisPlus3.4逆向工程的使用

    Mybatis和MybatisPlus3.4的使用 目录 Mybatis和MybatisPlus3.4的使用 1 RESTFUL 2 逆向工程 2.1 tkMybatis逆向工程 2.1.1 导入依赖 ...

  3. Jetpack Compose学习(6)——关于Modifier的妙用

    原文: Jetpack Compose学习(6)--关于Modifier的妙用 | Stars-One的杂货小窝 之前学习记录中也是陆陆续续地将常用的Modifier的方法穿插进去了,本期就来详细的讲 ...

  4. SpringCloud升级之路2020.0.x版-25.OpenFeign简介与使用

    本系列代码地址:https://github.com/JoJoTec/spring-cloud-parent OpenFeign 的由来和实现思路 在微服务系统中,我们经常会进行 RPC 调用.在 S ...

  5. 转载 使用wce进行本地和域的hash注入

    参数解释:-l 列出登录的会话和NTLM凭据(默认值)-s 修改当前登录会话的NTLM凭据 参数:<用户名>:<域名>:<LM哈希>:<NT哈希>-r ...

  6. Electron+Vue+ElementUI开发环境搭建

    Node环境搭建 本文假定你完成了nodejs的环境基础搭建: 镜像配置(暂时只配置node包镜像源,部分包的二进制镜像源后续讨论).全局以及缓存路径配置,全局路径加入到了环境变量 $ node -v ...

  7. Conda 创建和删除虚拟环境

    1.检验当前conda的版本 conda -V C:\Users>conda -V conda 4.10.1 2.conda 常用的命令 查看已有的虚拟环境 C:\Users>conda ...

  8. 项目优化之v-if

    前言: 在vue项目中,由于功能比较多,需要各种条件控制某个功能.某个标签.表格中的某一行是否显示等,需要使用大量的v-if来判断条件. 例如: <div v-if="isShow(a ...

  9. JavaScript04

    分离绑定事件 使用分离方式绑定元素事件可以使用页面元素与JavaScript代码完全分离,有利于代码分工和维护,是目前开发主流,分为两步: 1.获取需要绑定事件的元素 语法:根据id属性值取元素节点 ...

  10. 整理一下在 npmjs.com 上面发布资源包踩过的坑

    正常流程就不说了,网上有很多,比如写代码.打包.注册.登录.发布等. 邮箱要激活 在 npmjs.com 上面注册账号的时候需要填写邮箱,然后登录网址的时候并没有强制要求你去邮箱激活. 但是到了发布资 ...