webpack5零基础入门-12搭建开发服务器

1.目的

每次写完代码都需要手动输入指令才能编译代码,太麻烦了,我们希望一切自动化

2.安装相关包

复制代码
npm install --save-dev webpack-dev-server

3.添加配置

在webpack.config.js中添加devServer相关配置

复制代码
  /**开发服务器 */
    devServer: {
        host: 'localhost',//启动服务器域名
        port: "3000",//启动服务器端口号
        open: true,//是否自动打开浏览器
    }

4.启动服务

执行npx webpack serve

此时修改文件后,webpack会自动重新打包

注意:开发服务器不会输出资源,在内存中进行编译打包的。

相关推荐
yingyima2 分钟前
深入解析:定时任务失败重试机制的底层原理与实践
前端
哈撒Ki2 分钟前
快速入门vue3与常见面试题
前端·vue.js·面试
踩着两条虫6 分钟前
VTJ.PRO v2.4.2 私有化部署与升级实操指南
前端·人工智能·低代码·架构·数据挖掘
木斯佳12 分钟前
前端八股文面经大全:美团前端暑期实习一面(2026-06-08)·面经深度解析
前端
Uso_Magic19 分钟前
VOL_实现APP多文件上传_前端多文件显示!
前端
问心无愧051325 分钟前
ctf sow web入门112
android·前端·笔记
库拉大叔34 分钟前
工具调用效率对比实测:GPT-5.5与Gemini 3.5 Flash性能评估
java·前端·人工智能
艾伦野鸽ggg38 分钟前
CSS容器查询和悬浮间隙问题
前端·css
云水一下1 小时前
Vue.js从零到精通系列(一):初识Vue——背景、环境与第一个应用
前端·javascript·vue.js
Rauser Mack1 小时前
不懂编程,但是vibe coding一个扫雷游戏
人工智能·python·游戏·html·prompt