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

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

相关推荐
没有鸡汤吃不下饭7 分钟前
前端打包出一个项目(文件夹),怎么本地快速启一个服务运行
前端·javascript
liusheng9 分钟前
Capacitor + React 的 iOS 侧滑返回手势
前端·ios
CUYG21 分钟前
v-model封装组件(定义 model 属性)
前端·vue.js
子洋23 分钟前
基于远程开发的大型前端项目实践
运维·前端·后端
用户350201588474827 分钟前
基于react-routet v7 的配置式 + 约定式路由系统 第一步:引入react-routerv7
前端
用户350201588474829 分钟前
基于react-routet v7 的配置式 + 约定式路由系统 第二步:一个简单的约定式路由系统
前端
攀登的牵牛花33 分钟前
前端向架构突围系列 - 框架设计(七):反应式编程框架Flower的设计
前端·架构
佛系打工仔35 分钟前
K线绘制前言
前端
遇见~未来1 小时前
JavaScript数组全解析:从本质到高级技巧
开发语言·前端·javascript
石像鬼₧魂石1 小时前
80 端口(Web 服务)渗透测试完整总结(含踩坑 + 绕过 + 实战流程)
linux·运维·服务器·前端·网络·阿里云