09 —— Webpack搭建开发环境

搭建开发环境 ------ 使用webpack-dev-server

启动Web服务,自动检测代码变化,有变化后会自动重新打包,热更新到网页(代码变化后,直接替换变化的代码,自动更新网页,不用手动刷新网页)

如何搭建开发环境

  • 下载webpack-dev-server软件包到当前项目
  • 设置模式为开发模式
  • 配置自定义命令

启动后自动弹出浏览器 --open

  • npm run dev启动开发服务器

版本兼容性问题

"webpack": "^5.74.0",

"webpack-cli": "^4.10.0",

"webpack-dev-server": "^4.7.0"

webpack-dev-server借助http模块创建8080默认Web服务 ;

默认以public文件夹作为服务器根目录;


相关推荐
冰糖雪梨dd1 分钟前
【JavaScript】 substring()方法详解
开发语言·前端·javascript
John Song6 分钟前
npm查看全局安装了哪些命令
前端·npm·node.js
polaris063010 分钟前
Node.js HTTP模块详解:创建服务器、响应请求与客户端请求
服务器·http·node.js
清汤饺子15 分钟前
用了大半年 Claude Code,我总结了 16 个实用技巧
前端·javascript·后端
mCell7 小时前
【短文】不是最强,是最适合
前端·aigc·deepseek
余瑜鱼鱼鱼8 小时前
HTML常用标签总结
前端·html
Jave21088 小时前
Vue 中 mixins 混合开发的主要使用场景有哪些?
前端·vue.js
徐同保8 小时前
openclaw安装
前端
JEECG低代码平台9 小时前
JeecgBoot低代码平台 Ant Design Vue 4.x 升级避坑指南
前端·vue.js·低代码
yashuk9 小时前
Go-Gin Web 框架完整教程
前端·golang·gin