教你如何讀webpack2中文文件

李CHENGXI發表於2017-02-26

原文地址

經過一個多月的奮戰,webpack2的中文文件已經翻譯好大部份,並且完成了核心內容“概念”和“指南”部份的校對。

這份文件比react, vue之類的文件都要龐大而且複雜。本文帶你如何快速讀懂這份文件。

首先是“概念”。這部份對於菜鳥或者老司機來說,都是值得一讀的,由於webpack跟之前的grunt, gulp都有所不同,它是基於模組的配置型構建工具,許多理念對於前端玩家來說都是全新的,例如,什麼是入口(entry),它有幾種配置的方式,如何配置我們需要輸出(output)的位置、檔名,載入器(loaders),和外掛(plugins)是如何幫助我們編譯檔案和處理各種自動化任務的,webpack要打包的模組(module)到底是什麼,它去哪裡解析(resolve)檔案等等,這裡都會幫你一一解答。

在你瞭解了webpack的概念之後,接下來,可以看看“指南”。這裡的內容都是實踐經驗之談,例如前四篇文章主要是介紹怎麼用webpack去初始化一個專案,並進行釋出;《從v1遷移到v2》幫助你順利從webpack1升級至webpack2。其它的文件,主要是介紹webpack一些比較精彩的特性,例如拆包、熱替換等等,還有一些比較有趣的,像怎麼用typescript寫webpack配置,怎麼用虛擬機器跑webpack等等。

如果你對前兩部份都瞭如指掌,那麼恭喜你,你已經具備能力進入webpack的深水區了--更為細緻的"文件"了。

點選”文件“,首先進入的是"配置",這裡算是完整配置的介紹,要搭建一個更為完善的腳手架或者構建工具,需要仔細閱讀這裡的配置文件。

“API”主要介紹了像webpack命令列的使用、如何在Node.js中結合webpack來搭建構建工具。對比起webpack1,webpack2的命令列工具變得更為強大,而且可以對你的構建耗時進行分析。

API中另外的兩部份,“載入器API”“外掛API”,可以結合“開發”部份來看,主要是幫助開發者更好地開發webpack的載入器和外掛,藉助webpack的能力去解決自身專案中遇到的構建問題。對比webpack1,這是一份更好的載入器和外掛開發文件,因為它不僅介紹了推薦的寫法,還把內部的事件、內部可呼叫的一些方法,都展現了出來,賦予了開發者更多的能力。

webpack2的文件,耗費了許多人大量的心血,尤其要感謝最開始啟動這個翻譯專案的dear-lizhihua 還有 dingyiming,webpack中文社群的幾位籌辦成員,還有許多貢獻本專案的熱心技術同仁

如果想參與我們的翻譯專案,請關注我們的官方文件翻譯計劃

如果有webpack相關的技術文章,可以在awesome-webpack-cn給我們提pull request。

如果有興趣參與社群籌辦,請關注我們的harpers專案。

我們會持續關注webpack,關注前端工程化發展的方方面面。

By AlloyTeam LeeHey,

webpack-china首席打雜

於2017.2.25,一個寒冷的春夜

相關文章