webpack5下使用webpack-dev-server不能正常启动

最新推荐文章于 2024-05-08 18:11:51 发布
最新推荐文章于 2024-05-08 18:11:51 发布
阅读量3.5k 收藏 4
点赞数 7
分类专栏： webpack
原文链接：https://blog.csdn.net/xiaolongbaobushibao/article/details/113390838?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522161484107116780266275175%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=161484107116780266275
版权

报错：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 不能正常启动，解决了这个疑难杂症

将package.json文件中配置server的地方改成如下样子即可：以前是：webpack-dev-server --mode development

"scripts": {
    "dev": "webpack serve --mode development"
},
Gemini_Kanon
关注
  • 7
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 7
    评论
专栏目录
webpack-使用webpack-dev-server.rar
04-12
热模块替换是 `webpack-dev-server` 的一项高级特性，它允许在不刷新整个页面的情况下更新模块。这意味着你可以修改组件或样式，并立即看到变化，保持应用程序的状态。它通过在模块被替换时注入更新来实现这一点，...
webpack 之 webpack5 webpack-dev-server 版本兼容问题
shenjing_Shining的博客
11-11 4355
在写
下载webpack插件：webpack-dev-server 后运行npm run dev 不报错 但页面运行无效果
m0_66778036的博客
04-13 466
解决：在html中引入。
Vue基础技术 webpack-dev-server的配置和使用_loglevel webpack-dev-server(1)
最新发布
2401_84619530的博客
05-08 1006
全网独播-价值千万金融项目前端架构实战从两道网易面试题-分析JavaScript底层机制RESTful架构在Nodejs下的最佳实践开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】一线互联网企业如何初始化项目-做一个自己的vue-cli思维无价，看我用Nodejs实现MVC代码优雅的秘诀-用观察者模式深度解耦模块前端高级实战，如何封装属于自己的JS库VUE组件库级组件封装-高复用弹窗组件output: {},module: {
web3.0 升级到webpack5.0 以及兼容IE处理
zhxh0376的专栏
07-06 2674
如果你的事vue-cli 或者其他cli 关于IE 兼容不具有什么参考价值。如果是react 项目，你看看就行。webpack3的打包速度已成为诟病，所以我们将原来的webpack3升级至webpack5首先就是原来的项目结构，主要在于build目录下面，存在基础配置，开发配置，生产配置build。
vue-cli webpack打包遇到的坑，npm run dev 没有错误，访问页面却没有内容
逆水行舟，不进则退
07-14 1万+
1. git clonegit@gitee.com:hotsuitor/learn_vuejs.git2. npm install3. npm run dev4. 在浏览器打开页面查看，什么内容也没有4.2 正常应该可以看到这样的效果5. emmmmm，昨晚还是好好的，想想自己改了什么？发现图2报错404，昨晚打包的时候修改了文件的生成路劲，改为了相对路径，改回绝对路径试试6.7. 果然...
webpack-dev-server 配置以及webpack教程
weixin_40254430的博客
02-09 4111
webpack是什么? 一开始我也不理解? 看了许多文档都是在扯淡，摞了一大堆,点子却没说到。当然我说的可能也不对，希望诸位取其精华，去其糟粕。 因为包括官方文档，虽然翻译说的是人话，但是你却找不出一点点有用的有效的信息。 至于其他人的就是罗里吧嗦一大堆。写这个，就是想说，这玩意其实很简单。包括在php上，就是php的blade指令。不过php是直接略过了。压根没当回事。是因为什么被搞复杂了。是因为每个人的思维不透明。才造成交流沟通的困难。我这里写这个就是希望可以帮助到大家。 webpack其实就两个关.
使用webpack3.0配置webpack-dev-server教程
08-27
在devServer中，我们可以使用hot属性来启用热模块替换特性，但是需要使用webpack.HotModuleReplacementPlugin插件。下面是一个基本的配置示例： ``` const path = require("path"); const webpack = require(...
详解webpack-dev-server的简单使用
08-27
* 在 webpack.config.js 中添加 devServer:{inline:true} 2. 当以 Node.js API 启动 Webpack-dev-server 时，我们也需要做两点： * 由于 Webpack-dev-server 的配置中无 inline 选项，我们需要添加 webpack-dev-...
webpack-dev-server自动更新页面方法
11-26
Webpack 是一个流行的模块打包工具，而 Webpack Dev Server 是它的一个配套服务，提供实时重载、热模块替换等开发环境优化功能。在本文中，我们将深入探讨如何利用 Webpack Dev Server 实现页面的自动更新。 首先，...
webpack5 + webpack-dev-server
S_SL_rule的博客
11-27 480
学习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。 .
启动vue项目时报错：‘webpack-dev-server‘ 不是内部或外部命令，也不是可运行的程序
weixin_44284276的博客
03-11 230
1、先将自己项目中的“node_modules”文件删除掉。 2、在终端依次输入：npm install、npm run build，最后运行npm run dev后项目成功运行。
webpack-dev-server5.0+ 版本问题
gaodda的博客
03-12 546
在使用webpack-dev-server搭建新项目时，需要依赖node 和webpack以及webpack-cli。这是需要注意各个应用之间的版本问题。
解决vue项目 改东西则项目中断 报错（内存溢出）​`webpack-dev-server --inline --progress --config build/webpack.dev.conf.j
w1939459的博客
10-13 1444
解决vue项目 改东西则项目中断 报错（内存溢出）​`webpack-dev-server --inline --progress --config build/webpack.dev.conf.j
正确主动关闭websocket，异常关闭处理
热门推荐
资深全栈开发工程师
11-16 1万+
开发大型项目时需要正确主动关闭websocket，同时根据异常关闭正确的执行重连。后面的不想翻译，请读者自行翻译，帮你贴一个。
vue 项目启动失败 ‘webpack-dev-server‘ 不是内部或外部命令，也不是可运行的程序
阿涩的博客
10-14 5801
'webpack-dev-server' 不是内部或外部命令，也不是可运行的程序
webpack5+webpack-dev-server启动项目热更新失效/热更新无效，webpack5热更新无效【解决办法】
01-21 5715
最近在玩 webpack5 项目的时候，使用 webpack-dev-server 的热更新失败了，刚开始是启动失败，后来是热更新失败，真的是很头疼，报错好解决Cannot find module ‘webpack-cli/bin/config-yargs‘ 这个错误如果使用的 webpack5 + webpack-cli4.+ 的话，启动方式就不能使用 webpack-dev-server config.js 这种方式启动了，需要使用 webpack server 来启动 webpack-dev-serv
webpack serve 正常启动但没效果
goodman2980的博客
08-08 1336
安装完 webpack-dev-server 后 配置webpack.config.js。然后 npm run dev，服务器正常启动，且保存修改index.js有反应。但是打开网页却发现js的修改对网页没有效果。在package.json中配置。
解决Webpack Serve打包时没有Output输出的问题
wulinhan_csdn的博客
10-29 949
解决Webpack Serve打包时没有Output输出的问题
webpack webpack-cli webpack-dev-server配置
08-16
devServer: { contentBase: './dist', }, }; ``` 上述配置指定了入口文件为`src/index.js`，输出文件为`dist/bundle.js`，并启用了开发服务器。 5. 在`package.json`文件中添加以下脚本命令： ```json ...
评论 7
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值