Webpackのプラグイン

Webpackが実行するタスクの範囲は狭いです。 機能を拡張するためには、追加のプラグインを インストールして接続する必要があります。

プラグインのインストールと接続の 一般的なアルゴリズムを考察してみましょう。 そのために、仮想のプラグイン test-webpack-pluginがあるとします。 この例を使ってプラグインの操作を 考察してみましょう(以下のコードは単なるスキーマです。 実際にはそのようなプラグインは存在しません)。

まず、プラグインをnpmでインストールする必要があります:

terminalnpm install test-webpack-plugin --save-dev

その後、プラグインを設定ファイルにインポートする必要があります:

webpack.config.jsimport TestWebpackPlugin from 'test-webpack-plugin';

次に、このプラグインをpluginsの設定で呼び出す必要があります:

webpack.config.jsexport default {
  entry: './src/index.js',
  plugins: [new TestWebpackPlugin()],
};

pluginsの設定には、 1つだけでなく複数のプラグインを含めることができます:

webpack.config.jsexport default {
  entry: './src/index.js',
  plugins: [
    new TestWebpackPlugin1(),
    new TestWebpackPlugin2()
  ],
};