webpack的安装
1、初始化：
2、全局安装webpack（cnpm install [email protected] -g）
由于我的电脑不能用cnmp装，所以用了npm
3、局部安装webpack（cnpm install [email protected] --save-dev）
由于我的电脑不能用cnmp装，所以用了npm
4、在创建的demo文件夹下创建webpack.config.js文件（配置文件），src文件夹（开发阶段），dist文件夹（部署阶段）
node_modules安装的依赖，package.json：当前依赖文件的信息
5、在src文件夹里建立一个入口文件
6、在webpack.config.js里面配置入口文件
const path = require ( "path" )
//定义入口文件路径和出口文件路径
const PATH = {
//入口文件路径
app : path.join( __dirname , "./src/index.js" ) ,
// 出口文件路径
build : path.join ( __dirname , "./dist" )
}
//配置webpack
module.exports = {
//入口文件
entry : {
app : PATH.app
}
//出口文件
output : {
//说明：name和entry里面的 key相同，entry里面key是什么，name就是什么
filename : "[name].js"
build : PATH.build
}
}
7、遇到了 es6的代码，require的一些语法，处理这些模块，就用到了loader
（1）处理js需要安装的第三方包
（2）处理css需要loader
8、插件：html-webpack-plugin
安装：
引入模块：
const HtmlWebpackPlugin =require("html-webpack-plugin")
在module.exports中的plugins之中配置：
plugins:[
new HtmlWebpackPlugin()
]
html-webpack-plugin的高级应用
如需生成多个html，并且引入不同的js模块，可以多次调用new HtmlWebpackPlugin( )
9、服务器
全局安装：
局部安装
在package.json之中的 scripts之中添加
"dev" : "webpack-dev-server --open"
"--open"表示自动打开浏览器
开启服务：
npm run dev
此时 实现了实时刷新