配置webpack-dev-server

1.什么是webpack-dev-server

webpack-dev-server是用来配置本地服务器的，使用它可以为webpack打包生成的资源文件提供web服务。

webpack-dev-server  主要提供两个功能：

（1）为静态文件提供web服务

（2）自动刷新和热替换（HMR）

        自动刷新：修改文件或者修改代码的时候，网页会自动更新

        热替换：当我们修改其他的模块的时候， 进行局部刷新即可

 

2.安装webpack-dev-server

npm install --save-dev webpack-dev-server

3.配置webpack.config.js文件

devServer：{

       contentBase:'./build',   //设置服务器访问的基本目录

       host:'localhost',//服务器的ip地址

      port:8080,//端口

      open:true//自动打开页面

}

4.配置package.json

"scripts": {
  "dev": "webpack --mode development",
  "build": "webpack --mode production",
  "start": "webpack-dev-server --mode development"
},