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

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

相关推荐
拾荒李2 分钟前
在 Vue 项目里“无痛”使用 React 组件:以 Veaury + Vite 为例
前端·vue.js·react.js
dangfulin13 分钟前
简单的视差滚动效果
前端·css·视差滚动
Forget_855023 分钟前
RHEL——web应用服务器TOMCAT
java·前端·tomcat
myFirstName1 小时前
离谱!React中不起眼的[]和{}居然也会导致性能问题
前端
我是伪码农1 小时前
Vue 2.11
前端·javascript·vue.js
Amumu121381 小时前
CSS:字体属性
前端·css
凯里欧文4271 小时前
html与CSS伪类技巧
前端
UIUV1 小时前
构建Git AI提交助手:从零到全栈实现的学习笔记
前端·后端·typescript
wuhen_n1 小时前
JavaScript 防抖与节流进阶:从原理到实战
前端·javascript
百慕大三角1 小时前
AI Agent开发之向量检索:一篇讲清「稀疏 + 稠密 + Hybrid Search」怎么落地
前端·agent·ai编程