ProgressPlugin

?ProgressPlugin? 提供了一種自定義如何在編譯過程中報(bào)告進(jìn)度的方法。

Usage

創(chuàng)建 ?ProgressPlugin? 的一個(gè)實(shí)例，并提供一個(gè)允許的參數(shù)。

Providing ?function?

提供一個(gè)處理函數(shù)，當(dāng)鉤子報(bào)告進(jìn)度時(shí)調(diào)用它。處理程序函數(shù)參數(shù):

• ?percentage?:0到1之間的數(shù)字，表示編譯完成的百分比
• ?Message?:當(dāng)前正在執(zhí)行的鉤子的簡短描述
• ?…args?:零個(gè)或多個(gè)描述當(dāng)前進(jìn)度的附加字符串

const handler = (percentage, message, ...args) => {
  // e.g. Output each progress message directly to the console:
  console.info(percentage, message, ...args);
};

new webpack.ProgressPlugin(handler);

Providing ?object?

當(dāng)向 ?ProgressPlugin? 提供 object 時(shí)，支持以下屬性:

• ?activeModules (boolean = false)?:顯示活動(dòng)模塊數(shù)和一個(gè)正在進(jìn)行的活動(dòng)模塊消息。
• ?entries (boolean = true)?:顯示正在進(jìn)行的條目計(jì)數(shù)消息。
• ?handler?
• ?modules (boolean = true)?:顯示正在進(jìn)行的模塊計(jì)數(shù)消息。
• ?modulesCount (number = 5000)?:開始的最小模塊數(shù)。啟用modules屬性后生效。
• ?profile (boolean = false)?:告訴ProgressPlugin收集進(jìn)度步驟的概要數(shù)據(jù)。
• ?dependencies (boolean = true)?:顯示正在進(jìn)行的依賴項(xiàng)消息的計(jì)數(shù)。
• ?dependenciesCount (number = 10000)?:開始的最小依賴計(jì)數(shù)。啟用dependencies屬性時(shí)生效。
• ?percentBy (string = null: 'entries' | 'dependencies' | 'modules' | null)?:告訴 ?ProgressPlugin? 如何計(jì)算進(jìn)度百分比。

new webpack.ProgressPlugin({
  activeModules: false,
  entries: true,
  handler(percentage, message, ...args) {
    // custom logic
  },
  modules: true,
  modulesCount: 5000,
  profile: false,
  dependencies: true,
  dependenciesCount: 10000,
  percentBy: null,
});

Percentage calculation

默認(rèn)情況下，進(jìn)度百分比根據(jù)已構(gòu)建模塊數(shù)和總模塊數(shù)計(jì)算: built / total

模塊總數(shù)事先是未知的，并且在構(gòu)建過程中會(huì)發(fā)生變化。這可能導(dǎo)致不準(zhǔn)確的進(jìn)度百分比。

為了解決這個(gè)問題，?ProgressPlugin? 緩存最后已知的模塊總數(shù)，并在下一個(gè)構(gòu)建中重用這個(gè)值。第一次構(gòu)建將加熱緩存，但后續(xù)構(gòu)建將使用并更新此值。

我們建議對具有多個(gè)配置入口點(diǎn)的項(xiàng)目使用?percentBy: 'entries'?設(shè)置。百分比計(jì)算將變得更加準(zhǔn)確，因?yàn)槿肟邳c(diǎn)的數(shù)量是預(yù)先知道的。

Supported Hooks

下面的鉤子向?ProgressPlugin?報(bào)告進(jìn)度信息。

Compiler

• compilation
• emit*
• afterEmit*
• done

Compilation

• buildModule
• failedModule
• succeedModule
• finishModules*
• seal*
• optimizeDependenciesBasic*
• optimizeDependencies*
• optimizeDependenciesAdvanced*
• afterOptimizeDependencies*
• optimize*
• optimizeModulesBasic*
• optimizeModules*
• optimizeModulesAdvanced*
• afterOptimizeModules*
• optimizeChunksBasic*
• optimizeChunks*
• optimizeChunksAdvanced*
• afterOptimizeChunks*
• optimizeTree*
• afterOptimizeTree*
• optimizeChunkModulesBasic*
• optimizeChunkModules*
• optimizeChunkModulesAdvanced*
• afterOptimizeChunkModules*
• reviveModules*
• optimizeModuleOrder*
• advancedOptimizeModuleOrder*
• beforeModuleIds*
• moduleIds*
• optimizeModuleIds*
• afterOptimizeModuleIds*
• reviveChunks*
• optimizeChunkOrder*
• beforeChunkIds*
• optimizeChunkIds*
• afterOptimizeChunkIds*
• recordModules*
• recordChunks*
• beforeHash*
• afterHash*
• recordHash*
• beforeModuleAssets*
• beforeChunkAssets*
• additionalChunkAssets*
• record*
• additionalAssets*
• optimizeChunkAssets*
• afterOptimizeChunkAssets*
• optimizeAssets*
• afterOptimizeAssets*
• afterSeal*

Source

• ?ProgressPlugin? source