Internal webpack plugins

這是 webpack 內(nèi)部使用的插件列表。

內(nèi)部插件類別：

• environment
• compiler
• entry
• output
• source
• optimize

environment

影響編譯器環(huán)境的插件。

NodeEnvironmentPlugin

?webpack.node.NodeEnvironmentPlugin()?

將 Node.js 風(fēng)格的文件系統(tǒng)應(yīng)用于編譯器。

compiler

影響編譯器的插件

MemoryCachePlugin

?MemoryCachePlugin()?

向編譯器添加緩存，其中模塊緩存在內(nèi)存中。

ProgressPlugin

?ProgressPlugin(handler)?

連接到編譯器以提取進度信息。?handler? 必須具有 function(percentage, message)。百分比被稱為 0 到 1 之間的值，其中 0 表示開始，1 表示結(jié)束。

RecordIdsPlugin

?RecordIdsPlugin()?

從記錄中保存和恢復(fù)模塊和塊 ID。

entry

插件，將入口塊添加到編譯中。

EntryPlugin

?EntryPlugin(context, entry, options)?

在編譯時添加一個入口塊。該塊名為 ?options.name? 并且僅包含一個模塊（加上依賴項）。該模塊是從 context（絕對路徑）中的 entry 解析的。

PrefetchPlugin

?PrefetchPlugin(context, request)?

預(yù)取 request 和依賴項以啟用更并行的編譯。它不會創(chuàng)建任何塊。該模塊是根據(jù) context （絕對路徑）中的 request 解析的。

output

JsonpTemplatePlugin

?JsonpTemplatePlugin(options)?

塊被包裝到 JSONP 調(diào)用中。入口塊中包含加載算法。它通過添加 ?<script>? 標簽來加載塊。

options 是輸出選項。

?options.jsonpFunction? 是 JSONP 函數(shù)。

?options.publicPath? 用作加載塊的路徑。

?options.chunkFilename? 是預(yù)期塊下的文件名。

NodeTemplatePlugin

?node/NodeTemplatePlugin(options)?

塊被包裝到導(dǎo)出捆綁模塊的 Node.js 模塊中。入口塊通過要求它們來加載塊。

options 是輸出選項。

?options.chunkFilename? 是預(yù)期塊下的文件名。

LibraryTemplatePlugin

?LibraryTemplatePlugin(name, target)?

條目塊被裝飾以形成 ?type? 類型的 庫 ?name?。

WebWorkerTemplatePlugin

?webworker/WebWorkerTemplatePlugin(options)?

塊由 ?importScripts? 加載。否則它類似于 ?JsonpTemplatePlugin?。

 ?options? 是輸出選項。

EvalDevToolModulePlugin

通過將每個模塊包裝在一個用 ?// @sourceURL? 注釋的 eval 中來裝飾模塊模板。

SourceMapDevToolPlugin

?SourceMapDevToolPlugin（sourceMapFilename，sourceMappingURLComment，moduleFilenameTemplate，fallbackModuleFilenameTemplate） ?

通過為每個塊生成一個 SourceMap 來裝飾模板。

?sourceMapFilename? SourceMap 的文件名模板。 ?[hash]?、?[name]?、?[id]?、?[file]? 和 ?[filebase]? 被替換。如果缺少此參數(shù)，則 SourceMap 將內(nèi)聯(lián)為 DataUrl。

HotModuleReplacementPlugin

?HotModuleReplacementPlugin(options)?

添加對模塊熱更換的支持。裝飾模板以添加運行時代碼。添加 module.hot API。

?options.hotUpdateChunkFilename? 熱更新塊的文件名。

?options.hotUpdateMainFilename? 熱更新清單的文件名。

?options.hotUpdateFunction? 熱更新的JSON函數(shù)名。

source

影響模塊源代碼的插件。

APIPlugin

使 webpack_public_path、webpack_require、webpack_modules 和 webpack_chunk_load 可訪問。確保 ?require.valueOf? 和 ?require.onError? 不被其他插件處理。

CompatibilityPlugin

目前沒用。確保與其他模塊加載器的兼容性。

ConstPlugin

嘗試評估 ?if (...)? 語句和三元組中的表達式，用 true/false 替換它們，以便使用解析器觸發(fā)的掛鉤進一步消除可能的死分支。

生產(chǎn)模式針對死枝有多項優(yōu)化：

• The ones performed by Terser
• The ones performed by webpack

Webpack 將嘗試評估條件語句。如果成功，則刪除死分支。除非編譯器知道，否則 Webpack 不能進行常量折疊。例如：

import { calculateTax } from './tax';

const FOO = 1;
if (FOO === 0) {
  // dead branch
  calculateTax();
}

在上面的示例中，webpack 無法修剪分支，但 Terser 可以。但是，如果使用 DefinePlugin 定義 ?FOO?，webpack 將成功。

重要的是要提到 ?import { calculateTax } from './tax';? 也將被修剪，因為 ?calculateTax()? 調(diào)用在死分支中并被淘汰。

ProvidePlugin

?ProvidePlugin(name, request)?

如果 ?name? 在模塊中使用，則由 ?require(<request>)? 加載的模塊填充。

NodeStuffPlugin

?NodeStuffPlugin(options, context)?

提供通常在 Node.js 模塊中可用的內(nèi)容。

如果您使用它，它還確保 ?module? 充滿了一些 Node.js 的東西。

RequireJsStuffPlugin

提供通常在 require.js 中可用的內(nèi)容。

?require[js].config? 被移除。 ?require.version? 是 ?0.0.0?。 ?requirejs.onError? 映射為 ?require.onError?。

NodeSourcePlugin

?node/NodeSourcePlugin(options)?

該模塊添加了來自 Node.js 的內(nèi)容，這些內(nèi)容在非 Node.js 環(huán)境中不可用。

如果使用，它會為process, console, Buffer 和 global添加 polyfill。它還綁定了內(nèi)置的 Node.js 替換模塊。

NodeTargetPlugin

?node/NodeTargetPlugin()?

如果您在 Node.js 環(huán)境中運行捆綁包，則應(yīng)使用這些插件。

If 確保即使捆綁了本機模塊也能正確加載。

AMDPlugin

?dependencies/AMDPlugin(options)?

為模塊提供 AMD 風(fēng)格的define 和 require。還將 ?require.amd?、?define.amd? 和 webpack_amd_options## 綁定到作為參數(shù)傳遞的選項。

CommonJsPlugin

?dependencies/CommonJsPlugin?

為模塊提供 CommonJs 風(fēng)格的 ?require?。

RequireContextPlugin

?dependencies/RequireContextPlugin(modulesDirectories, extensions)?

提供 ?require.context?。參數(shù) ?modulesDirectories? 和 ?extensions? 用于查找文件的替代請求。提供與您提供給解析器相同的數(shù)組很有用。

RequireEnsurePlugin

?dependencies/RequireEnsurePlugin()?

提供 ?require.ensure?。

RequireIncludePlugin

?dependencies/RequireIncludePlugin()?

提供 ?require.include?。

DefinePlugin

?DefinePlugin(definitions)?

為標識符定義常量。

definitions 是一個對象。

optimize

請注意在 ?webpack.optimize? 命名空間下的所有插件應(yīng)該只在 ?mode? 設(shè)置為 ?'none'? 時使用。否則你將會在插件被兩次使用時遇到麻煩。

LimitChunkCountPlugin

?optimize/LimitChunkCountPlugin(options)?

合并塊限制塊計數(shù)低于 ?options.maxChunks?。

每個塊的開銷由 ?options.chunkOverhead? 提供或默認為 10000。條目塊大小乘以 ?options.entryChunkMultiplicator?（或 10）。

首先合并減少總大小最多的塊。如果多個組合相等，則最小合并大小獲勝。

MergeDuplicateChunksPlugin

?optimize/MergeDuplicateChunksPlugin()?

具有相同模塊的塊被合并。

RemoveEmptyChunksPlugin

?optimize/RemoveEmptyChunksPlugin()?

從塊中刪除每個父塊中包含的模塊。

MinChunkSizePlugin

?optimize/MinChunkSizePlugin(minChunkSize)?

合并塊，直到每個塊的最小大小為 ?minChunkSize?。

ModuleConcatenationPlugin

請查看 ModuleConcatenationPlugin 頁面 獲取更多內(nèi)容。

FlagIncludedChunksPlugin

?optimize/FlagIncludedChunksPlugin()?

添加塊中包含的塊的塊 ID。這消除了不必要的塊加載。

RealContentHashPlugin

?optimize/RealContentHashPlugin()?

當啟用 ?optimization.realContentHash? 選項時，webpack 將在內(nèi)部將 ?RealContentHashPlugin? 應(yīng)用于編譯器。

Hook

?RealContentHashPlugin? 提供了一個 ?updateHash? 5.8.0+ 掛鉤，用于自定義哈希更新：

const webpack = require('webpack');
const RealContentHashPlugin = webpack.optimize.RealContentHashPlugin;
// ...
compiler.hooks.compilation.tap('MyPlugin', (compilation) => {
  const hooks = RealContentHashPlugin.getCompilationHooks(compilation);
  hooks.updateHash.tap('MyPlugin', (content, oldHash) => {
    // you can calculate the hash here as you wish
  });
});