webpack4.XX安装webpack-dev-server工具以及遇到的各种问题

最新推荐文章于 2024-06-21 09:27:27 发布
最新推荐文章于 2024-06-21 09:27:27 发布
阅读量3k 收藏
点赞数 1
分类专栏： 工具 文章标签： 热替换
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/odelia145/article/details/102901215
版权

1.npm i webpack-dev-server -D 安装

2、package.json文件中配置dev 代替webpack-dev-server

3、运行

报这个错误说明webpack没有安装到项目中;就算之前装了webpack，那肯定是非全局安装，所以只需要将之安装到项目中即可:

4、再次执行npm run dev依旧报错：

各种百度之后发现可能是webpack与webpack-cli的版本不兼容的问题

npm i webpack-cli -D解决此问题

5、再次开启服务

服务正常启动

naomi吖
关注
专栏目录
webpack-dev-server的安装
周家大小姐
03-16 2万+
webpack-dev-server是一个小型的Node.js Express服务器,它使用webpack-dev-middleware来服务于webpack的包,除此自外，它还有一个通过Sock.js来连接到服务器的微型运行时. 注意:webpack-dev-server是一个独立的NPM包,你可以通过npm install webpack-dev-server来安装它. 发现报错了;原因是...
安装webpack-dev-server出现的问题
qq_43020961的博客
05-19 644
问题1：安装webpack-dev-server 报错Error:Cannot find module ‘webpack-cli/bin/config-yargs’ 1）原因： webpack，webpack-cli，和webpack-dev-server的版本有冲突，建议不要用最新的webpack和webpack-cli版本 2）推荐的版本： “webpack”: “4.44.2”, “webpack-cli”: “3.3.12”, “webpack-dev-server”: “^3.11.1” 安装具体
[webpack-cli] You need to install ‘webpack-dev-server‘ for running ‘webpack serve‘.TypeError: Canno
qq_54412839的博客
02-06 1343
原因：node的版本不对，本来是V12.0.0，后面改成成12.10.0之后成功启动。步骤：重新install。
Webpack构建工具入门教程
最新发布
weixin_45072119的博客
06-21 955
当我们习惯了在node中编写代码的方式后，在回到前端编写html、css、js这些东西会感觉到各种的不便。比如：不能放心的使用模块化规范（浏览器兼容性问题）、即使可以使用模块化规范也会面临模块过多时的加载问题。我们就迫切的希望有一款工具可以对代码进行打包，将多个模块打包成一个文件。这样一来即解决了兼容性问题，又解决了模块过多的问题。构建工具就起到这样一个作用，通过构建工具可以将使用ESM规范编写的代码转换为旧的JS语法，这样可以使得所有的浏览器都可以支持代码。
解决[webpack-cli] You need to install ‘webpack-dev-server Error: Cannot find module ‘send’问题（Linux也适用）
weixin_46900108的博客
09-20 1万+
我们在编译vue项目时，有时候就会遇到 [webpack-cli] You need to install 'webpack-dev-server Error: Cannot find module ‘send’这个报错问题 这里本着一个原则问题，缺啥安啥，然后重新加载一下，然后最好是重启一下电脑 在node.js安装包下重新加载安装的模型包 然后一路next就可以 最终我们重新加载一下就可以 yum install webpack-dev-server --save-dev 缺啥安啥缺什么模型包
[webpack-cli] For using ‘serve‘ command you need to install: ‘webpack-dev-server‘ package
weixin_45841729的博客
06-08 7280
错误描述 [webpack-cli] For using 'serve' command you need to install: 'webpack-dev-server' package [webpack-cli] Would you like to install 'webpack-dev-server' package? (That will run 'npm install -D webpack-dev-server') (Y/n) n npm ERR! code ELIFECYCLE npm ER
使用webpack遇到的大坑webpack-dev-server
weixin_45765103的博客
11-15 7255
node版本9 "dependencies": { "nvm": "0.0.4", "webpack-cli": "^4.9.1", "webpack-command": "^0.5.1" }, "devDependencies": { "webpack": "^4.46.0" } 运行webpack-dev-server的时候就会遇到 bash: webpack-dev-server: command not found 运行npx webpack-dev-server的时候就会遇.
webpack 使用webpack-dev-server 报错
enternal07的专栏
05-25 1282
使用webpacke 版本 5.23.0 ✖ ｢wds｣: Invalid configuration object. Webpack has been initialised using a configuration object that does not match theAPI schema. - configuration has an unknown property 'mode'. These properties are valid: object { amd?, bail...
egg-webpack:Egg Webpack Dev Server插件，支持内存文件和热重载
05-10
egg-webpack ^ 4.xx> webpack 4.xx egg-webpack ^ 3.xx> webpack 3.xx 安装 npm i egg-webpack --save 用法 // {app_root}/config/plugin.js exports . webpack = { enable : true , package : 'egg-webpack' , ...
vue2.x笔记7-webpack详解(2)
notChange的博客
02-15 720
本文主要包含：webpack配置vue，webpack的plugin，搭建本地服务器以及配置文件分离
react-router 使用webpack-dev-server做服务器时 单级刷新报错 Cannot GET /xx。多级刷新报错404
LimonSea的博客
07-22 1513
场景：在当前url刷新时页面变为Cannot GET /xx 有可能你用了 webpack-dev-server工具，需要在webpack.config.js中配置： module.exports = { ...... devServer: { ... historyApiFallback: true, // 这句话 }, } 再试试吧！ ...
yarn，webpack笔记
Yous的博客
08-07 622
什么是webpack打包模块化的JavaScript工具，在webpack中一切文件皆模块，通过loader转换文件，通过plugin注入钩子，最后输出由多个模块组合成的文件，专注于构建模块化项目优点1：专注于构建模块化项目2：通过plugin扩展3：loaders扩展，可以让webpack把所有类型的文件都解析打包。...
webpack4---jsbabel解析问题及uglify插件
学渣蓝鲸的博客
02-20 1249
目录 webpack配置踩坑 1.在webpack4配置过程中 使用 “uglifyjs-webpack-plugin”插件失败 3.关于js解析babel的配置问题 webpack4出了已经有一段时间了，我本来是在webpack中文文档学习，后来发现国内的中文文档 指南中有很多坑，与英文文档比对后，发现中文文档其实还没有更新到目前最新的版本，有很多地方都是根据老版本的webpack进行配...
webpack和webpack-dev-server的安装，查了很多网站，终于能用了
insgo的博客
10-18 849
** webpack 和 webpack-dev-server 的安装，看完就能用 以前装过的话要先卸载，卸载代码（卸载全局安装的的代码） ** npm uninstall webpack -g 项目中本地安装的可以直接删除项目中的node_modules文件夹 然后说安装吧，打开vscode的终端（终端-新建终端） 依次输入下面的代码，等待安装 npm init -y npm i jquery ...
解决 webpack5安装 webpack-dev-serve报错python问题 gyp ERR
kzj0916的博客
09-20 444
安装 webpack-dev-serve 执行指令：npm install webpack-dev-server -D 发现并没有老老实实给我们安装，而是报了一大堆错误，如下 报了一大堆Python相关错误 查了一大堆博客都没有找到解决方案 最后通过指定版本的方法解决了 解决方案 指定版本进行安装即可解决 执行：npm install webpack-dev-server@3.11.2 -D 安装成功！！ 防止大家踩坑 ...
'webpack-dev-server' 不是内部或外部命令，也不是可运行的程序 或批处理文件.
Wangdr的博客
05-17 602
删除node_module包 用npm i 或 cnpm i 从新下载 然后cnpm run dev
Error: Cannot find module ‘webpack/bin/config-yargs‘
风烟
08-24 2684
说我目前webpack5没有这个webpack-dev-server这个事webpack2或者3才有的东西，那说明现在启动方式还是不对，不能用这个webpack-dev-serevr启动，仔细发现我本地的package.json里面的不对，版本还是老的，我需要卸载重新安装才行。改完之后发现还是报错，但是提示需要安装webpack-cli，然后就安装下。看起来就是webpack语法的问题了，我尝试修改下。尝试装下试试，但是安装又报版本的错误。直接搜索，需要将启动语法从原来的。装了之后启动，然后报新的错误。
vue 如何新建一个项目
热门推荐
ygy211715的博客
02-27 5万+
身为入行未深的小白前端，不断的学习是我们不可丢失的习惯。前端流行的框架也是层出不穷，vue在众多框架中脱颖而出。今天花了两个小时的时间自己走了一边创建vue项目的流程，跟你们分享。1：打开cmd命令行，首先安装node步骤：https://nodejs.org/en/download/      node官网，选择跟自己的电脑匹配的版本进行下载，然后一步步的安装即可，输入node -v，如果出现版...
webpack-dev-server插件兼容问题：Error: Cannot find module ‘webpack-cli/bin/config-yargs‘
u011296285的博客
11-20 757
在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: ..
npm ERR! grad@2.8.25 dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 0.0.0.0`
09-21
npm ERR! grad@2.8.25 dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 0.0.0.0` 是一个...4. 检查webpack-dev-server的配置文件是否正确，确保没有语法错误或其他配置问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值