1-1爲什麼選擇webpack 和安裝 webpack
web開發的發展趨勢，如下所述：
- 在Npm Script 和Grunt時代，web開發要做的事情變多，流程複雜，自動化思想被引入，用於簡化流程；
- 在Gulp時代，開始出現一些新的語言用於提高開發效率，流式處理思想的出現是爲了簡化文件轉換的流程，例如將ES5轉成ES6；
- 在WebPack時代，由於單頁面的流行，網頁的功能和實現代碼變得複雜、龐大，eb開發向模塊化改進。
這些工具都有各自的定位和專注點，它們之間既可以單獨完成，也可以單配起來彌補各自的不足，在瞭解這些常見的構建工具後，我們需要根據自己的需求去判斷應該如何選擇和搭配它們才能更好地滿足自己的需求。
經過多年的發展，WebPack已經成爲構建工具中的首選，這是有原因的：
- 大多數團隊在開發新項目時會採用緊跟時代的技術，這些技術幾乎都會採用“模塊化+新語言+新框架”，WebPack可以爲這些新項目提供一站式解決方案；
- WebPack有良好的生態鏈和維護團隊，能提供良好的開發體驗並保證質量；
- WebPack被全世界大量的web開發者所使用和驗證，能找到各個層面所需的教程和經驗分享。
下面讓我們進入WebPack的世界吧！
安裝WebPack
再用WebPack執行構建任務時，需要通過WebPack可執行文件去構建任務，所以需要安裝webPack可執行文件。在安裝WebPack前請確保我們的系統文件安裝了5.0.0及以上版本的Node.js
在開始爲項目構建前，需要先新建一個web項目，有如下方式：
- 新建一個目錄，再進入項目根目錄執行npm init來初始化最簡單的採用了模塊化開發的項目；
- 用腳手架工具Yeoman直接丶快速的生成一個最符合自己需求的項目。
安裝WebPack到本項目
安裝WebPack到本項目時，可根據自己的需求選擇以下任意命令運行：
# npm i -D 是 npm install --save-dev 的簡寫，是指安裝模塊並保存到 package.json 的 devDependencies
# 安裝最新的穩定版
npm i -D webpack
# 安裝指定版本
npm i -D webpack@<version>
# 安裝最新的體驗版本
npm i -D webpack@beta
安裝完成後，我們可以通過以下途徑運行安裝到本項目的Webpack；
- 在項目根目錄下對應的命令行裏通過 node_modules/.bin/webpack 運行WebPack的可執行文件。
- 在 Npm Script 裏定義的任務會優先使用本項目下的 WebPack ，代碼如下：
json "scripts":{
"start":"webpack --config webpack.config.js"
}
安裝到全局後，我們可以在任何地方共用一個WebPack可執行文件，而不用各個項目重複安裝，安裝方式如下：
npm i -g webpack
雖然介紹了以上兩種安裝方式，但是我們推薦安裝到本項目，原因是可以防止不同項目因依賴不同版本的 WebPack 而導致衝突。