webpack——webpack-dev-server
1.安装"webpack-dev-server"
npm install webpacke-dev-server --save-dev
2."webpack-dev-server"在package.json中配置
"script":{
"dev":"webpack-dev-server"
}
3."webpack-dev-server"在webpack.config.js的配置
devServer: {
//开发服务器的配置
port:3000,
progress:true,//打包进度条的显示
contentBase:path.resolve(__dirname,'dist'),//将dist作为静态文件目录
compress:true,
open:true
}
"webpack-dev-server"属性解释
(1) contentBase ：指定服务器资源的根目录，如果不设置，默认是项目根目录，例如contentBase:"./dist",那么生产的文件都会放在dist目录下（npx webpack即webpackda打包和"webpack-dev-server"的区别：webpack打包生成js文件，真实的文件；"webpack-dev-server"不会输出js文件，仅仅出在内存中）
(2) port:设置服务的端口号
(3) host:服务器的主机号
(4) open:运行后自动打开浏览器
(5) compress:设置为true时对所有服务器资源采用gzip压缩方式（对js,css进行压缩，提高传输速率，优化前端性能）
(6) hot 和 inline：自动刷新和模块热替换机制
(7) filename:在惰性模式中，次选项可以减少编译。如果output的filename:"bundle.js",这里的lazy：true,filename:"bundle.js"
