プラグイン#

もしローダーがファイル変換（プリプロセッシング）の主力であるならば、プラグインはRspackビルドプロセスの全体的な主力です。Rspackのネイティブ実装のほとんどは、プラグインシステムのRust側に依存しています。Nodeユーザーの場合、Rustとの互換性の問題を心配する必要はありません。Rspackが自動的に詳細を処理してくれるからです。プラグインの使用方法に集中できます。使用可能なプラグインを確認してください。

プラグインの使用法#

既に互換性のあるwebpack-bundle-analyzerを`rspack.config.js`で使用する例を以下に示します。

const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');

module.exports = {
  plugins: [new BundleAnalyzerPlugin()],
};

さらに多くのRspackプラグインを探している場合は、サポートされているプラグインの優れたリストをご覧ください。

Rspack互換性テストに合格したWebpackプラグインのリストについては、プラグイン互換性も参照してください。

プラグインの作成#

プラグインの構造#

プラグイン作成者として、プラグインの構造は非常にシンプルです。`Compiler`インスタンスを受け入れる`apply`メソッドを実装するだけです。これは、Rspackプラグインの初期化時に呼び出されます。詳細なAPIはPlugin APIにあります。

const PLUGIN_NAME = 'MyPlugin';

class MyPlugin {
  apply(compiler) {
    compiler.hooks.compilation.tap(PLUGIN_NAME, compilation => {
      console.log('The Rspack build process is starting!');
    });
  }
}

module.exports = MyPlugin;

プラグインを`rspack.config.js`で`require`を使用して直接インポートできるように、CommonJSスタイルのモジュールエクスポートを使用します。

TypeScriptによる作成#

TypeScriptを使用してRspackプラグインを作成する場合は、`Compiler`と`RspackPluginInstance`をインポートして、プラグインの型を宣言できます。

import type { Compiler, RspackPluginInstance } from '@rspack/core';

const PLUGIN_NAME = 'MyPlugin';

class MyPlugin implements RspackPluginInstance {
  apply(compiler: Compiler) {
    compiler.hooks.compilation.tap(PLUGIN_NAME, compilation => {
      console.log('The Rspack build process is starting!');
    });
  }
}