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

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

相关推荐
程序员爱钓鱼13 小时前
Node.js 编程实战:测试与调试 —— 调试技巧与性能分析
前端·后端·node.js
JQLvopkk13 小时前
Vue框架技术详细介绍及阐述
前端·javascript·vue.js
vyuvyucd13 小时前
插件式开发:C++与C#实战指南
java·前端·数据库
C_心欲无痕13 小时前
ts - 类型收窄
前端·typescript
笔COOL创始人13 小时前
requestAnimationFrame 动画优化实践指南
前端·javascript·面试
sophie旭13 小时前
性能监控之首屏性能监控小实践
前端·javascript·性能优化
Amumu1213813 小时前
React 前端请求
前端·react.js·okhttp
38242782714 小时前
JS表单提交:submit事件的关键技巧与注意事项
前端·javascript·okhttp
Kagol14 小时前
深入浅出 TinyEditor 富文本编辑器系列2:快速开始
前端·typescript·开源
小二·14 小时前
Python Web 开发进阶实战:Flask-Login 用户认证与权限管理 —— 构建多用户待办事项系统
前端·python·flask