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

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

相关推荐
岭南灯火几秒前
前端通用交互式几何编辑器的设计法则 1 - 入口的对象及其成员
前端·javascript·架构
满栀58526 分钟前
Vue.js 接口封装最佳实践:从基础到高级
前端·javascript·vue.js
kyriewen1 小时前
我踩了三次同一个坑才明白:React里"改了数据却不重新渲染"的真正原因
前端·javascript·react.js
用户059540174462 小时前
把AI对话记忆测试从手动比对到Pytest+Redis自动化,验证效率提升了10倍,还顺带揪出3个隐蔽bug
前端·css
我星期八休息2 小时前
网络编程—网络层
开发语言·前端·网络·人工智能·智能路由器
A24207349302 小时前
React中请求拦截与响应拦截的统一处理方案
前端·javascript·react.js
IT_陈寒3 小时前
为什么我的Java Stream流操作会吃掉内存?
前端·人工智能·后端
嘟嘟07174 小时前
React 受控组件与非受控组件:表单数据到底归谁管?
前端·javascript·react.js
嘟嘟07174 小时前
React 表单管理进阶:从单字段到带校验的完整登录表单
前端·javascript·react.js
光影少年4 小时前
react navite原生事件监听、全局事件通知
前端·react native·react.js