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

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

相关推荐
2601_94961302几秒前
flutter_for_openharmony家庭药箱管理app实战+用药提醒列表实现
服务器·前端·flutter
利刃大大1 分钟前
【Vue】scoped作用 && 父子组件通信 && props && emit
前端·javascript·vue.js
-凌凌漆-9 分钟前
【Vue】Vue3 vite build 之后空白
前端·javascript·vue.js
心柠9 分钟前
前端工程化
前端
沐雪架构师21 分钟前
核心组件2
前端
qq_3363139322 分钟前
javaweb-Vue3
前端·javascript·vue.js
小圣贤君28 分钟前
Electron 桌面应用接入通义万相:文生图从 0 到 1 实战
前端·electron·ai写作·通义万相·ai生图·写作软件·小说封面
南风知我意95733 分钟前
【前端面试1】基础JS的面试题
前端·javascript·面试
wjhx43 分钟前
在Qt Design Studio中进行页面切换
前端·javascript·qt
钱多多先森44 分钟前
【Dify】使用 python 调用 Dify 的 API 服务,查看“知识检索”返回内容,用于前端溯源展示
开发语言·前端·python·dify