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会自动重新打包

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

相关推荐
keyborad pianist4 分钟前
Web开发 Day1
开发语言·前端·css·vue.js·前端框架
Never_Satisfied17 分钟前
在HTML & CSS中,可能导致父元素无法根据子元素的尺寸自动调整大小的情况
前端·css·html
We་ct26 分钟前
LeetCode 101. 对称二叉树:两种解法(递归+迭代)详解
前端·算法·leetcode·链表·typescript
码云数智-大飞31 分钟前
微前端架构落地实战:qiankun vs Module Federation 2026 深度对比与选型指南
前端·架构
IT枫斗者35 分钟前
MyBatis批量插入性能优化:从5分钟到3秒的工程化实践
前端·vue.js·mysql·mongodb·性能优化·mybatis
前端 贾公子1 小时前
深入理解 Vue3 的 v-model 及自定义指令的实现原理(中)
前端·html
Never_Satisfied1 小时前
在HTML & CSS中,img标签固定宽度时,img和图片保持比例缩放
前端·css·html
Cache技术分享1 小时前
327. Java Stream API - 实现 joining() 收集器:从简单到进阶
前端·后端
人工智能先锋1 小时前
从零部署你的24小时AI管家:OpenClaw完整实战指南(附踩坑记录)
前端·github
不是株2 小时前
苍穹外卖(前端)
前端