插件 (Plugin)#

如果说 Loader 是文件转换（预处理）的核心，那么插件（Plugin）则是 Rspack 整体构建流程的核心组成部分，大部分 Rspack 的原生实现依赖了 Rust 侧的插件系统。 对于 Node 的用户来说，你无需担心和 Rust 的 Interop 问题，因为 Rspack 会自动帮你处理好这些细节，你只需要关注如何使用插件即可。

示例#

编写一个插件#

插件的结构非常简单，只需要实现一个 apply 方法，这个方法接受一个 Compiler 实例，并会在 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;

我们使用 CommonJS 风格的模块导出，这样在 rspack.config.js 中就可以直接使用 require 导入。

使用插件#

在 rspack.config.js 中使用已经兼容的 webpack-bundle-analyzer :

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

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

请参考 Plugin 兼容 来了解完成 Rspack 兼容性测试的插件列表。

类型定义#

如果你使用 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!');
    });
  }
}