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文件夹作为服务器根目录;


相关推荐
支撑前端荣耀7 分钟前
从零实现前端监控告警系统:SMTP + Node.js + 个人邮箱 完整免费方案
前端·javascript·面试
重铸码农荣光11 分钟前
🎯 从零搭建一个 React Todo 应用:父子通信、状态管理与本地持久化全解析!
前端·react.js·架构
用户40993225021211 分钟前
Vue3 v-if与v-show:销毁还是隐藏,如何抉择?
前端·vue.js·后端
Mr_chiu12 分钟前
🚀 效率暴增!Vue.js开发必知的15个神级提效工具
前端
shanLion12 分钟前
Vite项目中process报红问题的深层原因与解决方案
前端·javascript
烟袅14 分钟前
从零构建一个待办事项应用:一次关于组件化与状态管理的深度思考
前端·javascript·react.js
前端小万17 分钟前
草稿
前端
闲云一鹤19 分钟前
将地图上的 poi 点位导出为 excel,并转换为 shp 文件
前端·cesium
岁月宁静1 小时前
MasterGo AI 实战教程:10分钟生成网页设计图(附案例演示)
前端·aigc·视觉设计
狗头大军之江苏分军1 小时前
快手12·22事故原因的合理猜测
前端·后端