react server

webpack-dev-server 是一个小型的静态文件服务器， 为webpack打包生成的资源提供服务

1  若有原有的安装包，需要先删除不兼容的版本

2  安装webpack webpack-dev-server 安装包

2.1 添加  webpack.dev.config的服务配置

contentBase 指的是url的根目录， 如果不设定， 默认指向项目根目录

3  启动服务 

 

4  查看页面内容

 

tip： webpack-dev-server 编译后的文件， 都存储在内存中， 开发者并不能看见， 可以删除dist/bundle.js 访问网站正常

 

5  优化服务启动命令  简化后使用 npm start

6 webpack-dev-server的配置项

historyApiFallback : 任意404响应被替代为index.html

使用场景： 访问localhost:8080 点击page1到链接 localhost:8080/page1, 刷新页面， 发现页面404 原因是dist文件目录下没有page1.html,所以404

hot : 启用webpack 的模块热替换特性

port: 需要监听的端口， 默认为8080

proxy:  比如在localhost:3000上有后端服务， 可以启用代理

proxy:{ "/api": "http://localhost:3000"} 

progress(CLI only) 将编译进度输出到控制台

tip： CLI   ----> command   line  interface 

7  修改webpack-dev-server配置

8 需要在命令行添加的配置