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

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

相关推荐
|晴 天|21 小时前
Vue 3 + TypeScript + Element Plus 博客系统开发总结与思考
前端·vue.js·typescript
猫3281 天前
v-cloak
前端·javascript·vue.js
旷世奇才李先生1 天前
Vue 3\+Vite\+Pinia实战:企业级前端项目架构设计
前端·javascript·vue.js
SoaringHeart1 天前
Flutter进阶:用OverlayEntry 实现所有弹窗效果
前端·flutter
奇舞精选1 天前
写 HTML 就能做视频?HeyGen 开源的这个工具有点意思
html·agent
IT_陈寒1 天前
Vite静态资源加载把我坑惨了
前端·人工智能·后端
herinspace1 天前
管家婆实用贴-如何分离和附加数据库
开发语言·前端·javascript·数据库·语音识别
小码哥_常1 天前
从MVC到MVI:一文吃透架构模式进化史
前端
嗷o嗷o1 天前
Android BLE 的 notify 和 indicate 到底有什么区别
前端
豹哥学前端1 天前
别再背“var 提升,let/const 不提升”了:揭开暂时性死区的真实面目
前端·面试