プラグイン

Webpackには豊富なプラグインインターフェースがあります。webpack自体内の機能のほとんどはこのプラグインインターフェースを使用しています。これにより、webpackは柔軟になります。

名前説明
BannerPlugin生成された各チャンクの先頭にバナーを追加する
ChunksWebpackPluginバンドルを提供するためのエントリポイントとチャンクの関係を持つHTMLファイルを作成します
CommonsChunkPluginチャンク間で共有される共通モジュールを抽出します
CompressionWebpackPluginContent-Encodingで配信するために、アセットの圧縮版を準備します。
ContextReplacementPluginrequire式の推論されたコンテキストを上書きします。
CopyWebpackPlugin個々のファイルまたはディレクトリ全体をビルドディレクトリにコピーします。
DefinePluginコンパイル時に構成されたグローバル定数を許可します。
DllPluginビルド時間を大幅に改善するために、バンドルを分割します。
EnvironmentPluginprocess.envキーに対してDefinePluginを使用するためのショートハンドです。
EslintWebpackPluginwebpack用のESLintプラグインです。
HotModuleReplacementPluginホットモジュールリプレースメント(HMR)を有効にします。
HtmlWebpackPluginバンドルを配信するためのHTMLファイルを簡単に作成します。
IgnorePlugin特定のモジュールをバンドルから除外します。
LimitChunkCountPluginチャンキングをより適切に制御するために、チャンキングの最小/最大制限を設定します。
MinChunkSizePluginチャンクサイズを指定された制限以上に保ちます。
MiniCssExtractPluginCSSを必要とするJSファイルごとにCSSファイルを作成します。
NoEmitOnErrorsPluginコンパイルエラーがある場合、エミッティングフェーズをスキップします。
NormalModuleReplacementPlugin正規表現に一致するリソースを置き換えます。
NpmInstallWebpackPlugin開発中に不足している依存関係を自動インストールします。
ProgressPluginコンパイルの進行状況をレポートします。
ProvidePluginimport/requireを使用せずにモジュールを使用できるようにします。
SourceMapDevToolPluginソースマップをより細かく制御できるようにします。
EvalSourceMapDevToolPluginevalソースマップをより細かく制御できるようにします。
SvgChunkWebpackPluginエントリポイントの依存関係に基づいてSVGOで最適化されたSVGスプライトを生成します。
TerserPluginTerserを使用してプロジェクト内のJSをminifyします。

より多くのサードパーティ製プラグインについては、awesome-webpackのリストを参照してください。

10 貢献者

simon04gonzoyumorouzbeh84aretecodeeko3alpharefactorizedbyzykEugeneHlushkosnitin315chenxsan