《前端》使用webpack+vue从零开始打造前端项目(2020最新版)五--开发环境的配置-devServer--bilibili-2021年1月27日

 

官网：https://www.webpackjs.com/guides/development/

https://www.webpackjs.com/configuration/dev-server/

watch mode（不常见）

webpack-dev-server（常用）

webpack-dev-middleware

 

开发环境配置

（一）devServer

为我们提供了一个简单的服务器，并能够实时重新加载。

作用：实时监控代码变化，帮助我们完成重新打包和刷新浏览器的功能。

1、安装

npm install -D webpack-dev-server

2、修改配置文件，告诉开发服务器(dev server)，在哪里查找文件：

    devServer: {

        contentBase: './dist',// 指定服务器根目录

        open:true,// 自动打开浏览器

    },