總結(jié): 通過各種plugin處理各種文件資源紧憾。
我看webpack 源碼的先后順序大致為：
1. package.json里是一些基本設(shè)置
2. lib/webpack.js 和 bin/webpack.js 是webpack的執(zhí)行入口
代碼里可查看到webpack對入?yún)⒌奶幚恚恍┏跏蓟僮鞑常约拜敵鰧ο箢愋?/p>
3.webpack 的核心compiler
webpack 的?Compiler?模塊是主引擎赴穗，它通過 webpack CLI 或?webpack?API 或 webpack 配置文件傳遞的所有選項(xiàng)，創(chuàng)建出一個 compilation 實(shí)例膀息。
Compiler?也是我們所說的?Tapable?實(shí)例望抽。通過這種實(shí)現(xiàn)機(jī)制，我們可以理解為履婉，它混合(mix)了?Tapable類煤篙，來使實(shí)例也具備注冊和調(diào)用插件功能。大多數(shù)面向用戶的插件毁腿，要首先在?Compiler?上注冊辑奈。Compiler 運(yùn)行機(jī)制可以被提取為以下要點(diǎn)
*?通常有一個 Compiler 的主實(shí)例苛茂。可以創(chuàng)建子 compilers 來委托特定任務(wù)鸠窗。
*?創(chuàng)建 compiler 的多數(shù)復(fù)雜度妓羊，在于為它填充所有相關(guān)的 options 選項(xiàng)。
*?webpack?通過?WebpackOptionsDefaulter?和?WebpackOptionsApply稍计，來專門為?Compiler?提供所需的所有初始數(shù)據(jù)躁绸。
*?Compiler?是一個執(zhí)行最簡功能，來保證生命周期運(yùn)行的函數(shù)臣嚣。它把所有的加載(loading)/打包(bundling)/寫入(writing)工作委托給各種插件净刮。
* plugin.apply(compiler)?將插件注冊到?Compiler?生命周期中的任何特定鉤子事件。
*?Compiler?暴露?run?方法硅则，它啟動了?webpack?所有編譯工作淹父。在執(zhí)行完成后，會調(diào)用傳遞給它的?callback?函數(shù)怎虫。記錄 stats 和 errors 的所有末端工作暑认，都在此回調(diào)函數(shù)中完成。
4. compiler 的核心tapable
以下摘自官網(wǎng):
Tapable?是一個小型的庫大审，允許你對一個 javascript 模塊添加和應(yīng)用插件蘸际。它可以被繼承或混入到其他模塊中。類似于 NodeJS 的?EventEmitter?類徒扶，專注于自定義事件的觸發(fā)和處理捡鱼。除此之外，Tapable?還允許你通過回調(diào)函數(shù)的參數(shù)酷愧，訪問事件的“觸發(fā)者(emittee)”或“提供者(producer)”。
個人理解：
tapable 類似于事件處理缠诅，可注冊各種事件+回調(diào)溶浴， 在webpack中用于各種插件注冊和處理。
pulgin 函數(shù)相當(dāng)于事件on
applyPlugin 相當(dāng)于事件的emit
tapable 查看代碼文件路徑順序?yàn)椋篢apable.js -> SynicBailHook.js -> Hook.js
5. 各種plugin
太多了管引，晚點(diǎn)看……
