什么是webpack？ 模块打包机，它可以分析项目，将项目里js模块、浏览器不能直接运行的打包成合适的格式。
为什么使用webpack？ 通过webpack写一些需要的配置，然后编译，，如自动帮忙把babel,scss打包编译转成css,提高效率。
创建一个文件夹 （名不可以用webpack）
1.在中断中打开这个文件夹，注意看路径是否是当前这个文件，初始化 npm init
2.npm install webpack webpack-cli -D
3.在这个文件夹下创建一个文件名固定为 webpack.config.js 在这里面配置 入口entry(他是一个对象）出口output等 在出口这里有两个值， 一个是打包到哪里的路径（绝对路径，一般都固定写法），一个是打包好的名字
-
创建打包编译前文件夹src，里面可以放scss ,打包编译好的文件夹dist
-
在package.json 里的scripts标签（用npm run XXX执行命令） 配置命令。例如 "build":"webpack" 设置开发环境 mode:"development",线下未压缩的，便于调试代码。 "production"上线的，压缩。
服务与热更新：实时编译，在当前浏览器就可以访问
安装 npm install --save-dev webpack-dev-server
在model.exports里在package.json 里的scripts标签
devServer:{
contentBase:path.resolve(__dirname,"dist"), //打开文件夹
host:"localhost", //ip地址
port:8089,
compress:true,//开启压缩
open:true //自动开启浏览器
}
html文件打包 const HtmlPlugin=require("html-webpack-plugin") 下载 npm install html-webpack-plugin --save-dev
plugins:[
new HtmlPlugin({
minify:{
removeAttributeQuotes:true// 对html压缩，把属性的引号去掉
},
hash:true,//引进最新的
template:"./src/index.html"//要打包的路径
})
]
