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

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

相关推荐
LIO19 小时前
掌握 React useEffect:核心概念、使用技巧与常见陷阱
前端·react.js
XD74297163619 小时前
科技早报晚报|2026年5月12日:GUI Agent、编程会话工作台与 npm 安装门禁,今晚更值得做的 3 个技术机会
前端·科技·npm·供应链安全·ai agent·开发者工具
前端那点事19 小时前
Vue3 新趋势:10个高阶实用操作|性能优化+开发提效+避坑指南
前端·vue.js
small_white_robot19 小时前
idek-2022 web 全wp——持续更新
开发语言·前端·javascript·网络·安全·web安全·网络安全
漫游的渔夫19 小时前
从 if-else 乱麻到状态机:前端开发者该怎么理解多 Agent 协作?
前端·人工智能·typescript
前端那点事19 小时前
90%前端只会皮毛!JSON.parse/stringify高阶用法、数据规则、避坑终极指南
前端·vue.js
需要坚持的人19 小时前
让 SVG 不再“丢字变形”:一次思维导图导出文字转 Path 的实战优化
前端·vue.js·svg
sp4219 小时前
NativeScript 5.1:直接集成 Objective-C 代码
前端·javascript
UXbot19 小时前
AI一次生成iOS和Android双端原型功能详解
android·前端·ios·kotlin·交互·swift
我是卡卡啊19 小时前
View 绘制深度分析:HWUI · RenderThread · SurfaceFlinger
前端