文档地址 http://webpack.github.io/docs/usage.html
首先全局安装webpack(我这里使用的是淘宝的cnpm)
cnpm install webpack
检查一下是否安装完毕,查看版本号
webpack -h
简历package.json文件
npm init 一直enter就可以了
然后再本地安装一次webpack
cnpm install webpack --save-dev
新建webpack.config.js
module.exports = {
entry: './js/app.js', //入口文件
output: {
path: './build', //打包好的文件夹
filename: 'main' //打包好的文件名
}
};
配置完webpack.config后,目录需要有一个index.html文件在body内引入/build/main.js
然后就可以设置热加载了
首先是安装webpack-dev-server模块
cnpm install webpack-dev-server --save-dev
执行开启自动刷新
webpack && webpack-dev-server --hot --inline
打开浏览器输入 localhost:8080 修改app.js就可以不用刷新看到你做的修改了
升级版
在package.json 中的script中加入字段
"start": "webpack && webpack-dev-server --hot --inline"
现在直接输入 npm start 就可以实现同样效果了