1、安裝前準備 安裝 webpack 之前，需要安裝 node，這時最新的是 6，npm 是 4。如果有老的 node 項目在跑建議安裝下 nvm。 2、建議安裝在局部，即在項目下的 node_modules 里 比如在 webpack_demo 目錄下新建了一個 w1 項目，先用 npm init ...
1、安裝前準備
安裝 webpack 之前，需要安裝 node，這時最新的是 6，npm 是 4。如果有老的 node 項目在跑建議安裝下 nvm。
2、建議安裝在局部，即在項目下的 node_modules 里
比如在 webpack_demo 目錄下新建了一個 w1 項目，先用 npm init -y 命令生成一個 package.json 文件
接著執行 npm install webpack --save-dev 安裝最新的 webpack
1分鐘不到安裝成功後，輸入 ./node_modules/.bin/webpack -v 可以測試下
如果是全局安裝，直接輸入 webpack 即可
3、w1目錄創建 app 目錄及 index.js
index.js 內容如下
import _ from 'lodash';
function component () {
var element = document.createElement('div');
/* lodash is required for the next line to work */
element.innerHTML = _.join(['Hello','webpack'], ' ');
return element;
}
document.body.appendChild(component());
4、index.js 用到了 lodash.js ，因此也需要安裝下
5、w1目錄下創建 index.html，內如如下
<html>
<head>
<title>webpack 2 demo</title>
</head>
<body>
<script src="dist/bundle.js"></script>
</body>
</html>
最後的 w1 的目錄結構如下
6、index.html 中引入的是 dist/bundle.js ，這個 dist 目錄即是 webpack 執行輸出的
cd 到 w1 執行 ./node_module/.bin/webpack app/index.js dist/bundle.js
回到 w1，下麵多出了一個 dist 目錄和 bundle.js
7、打開 index.html，可以看到頁面輸出了 “Hello webpack”，至此完成。
8、index.js 中用到了 ES6 的 import，這個 webpack 預設支持，完整的 ES6 語法需要單獨安裝 babel。
