CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-rspack--core

Fast Rust-based web bundler with webpack-compatible API

Pending
Overview
Eval results
Files

plugins.mddocs/

Plugin System

Built-in plugins for optimization, development, asset processing, and build customization using the Tapable hooks system.

Capabilities

Plugin Architecture

Base plugin interfaces and creation patterns.

/** Standard plugin interface */
interface RspackPluginInstance {
  /** Apply plugin to compiler */
  apply(compiler: Compiler): void;
  /** Optional plugin properties */
  [key: string]: any;
}

/** Function-based plugin */
type RspackPluginFunction = (this: Compiler, compiler: Compiler) => void;

/** Union type for all plugin types */
type Plugin = RspackPluginInstance | RspackPluginFunction | WebpackPluginInstance | 
  WebpackPluginFunction | Falsy;

type Falsy = false | null | undefined;

/** Abstract base class for builtin plugins */
abstract class RspackBuiltinPlugin implements RspackPluginInstance {
  abstract name: BuiltinPluginName;
  apply(compiler: Compiler): void;
  raw(compiler: Compiler): any;
}

/** Create custom native plugins */
function createNativePlugin(options: any): RspackPluginInstance;

Core Development Plugins

Essential plugins for development workflow and debugging.

/** Enable Hot Module Replacement */
class HotModuleReplacementPlugin extends RspackBuiltinPlugin {
  name: "HotModuleReplacementPlugin";
  /** No constructor options required */
  constructor();
}

/** Define global constants at compile time */
class DefinePlugin extends RspackBuiltinPlugin {
  name: "DefinePlugin";
  constructor(options: DefinePluginOptions);
}

type DefinePluginOptions = Record<string, CodeValue>;
type CodeValue = string | boolean | number | null | undefined | RegExp | bigint | 
  CodeValueFunction | CodeValueObject;

interface CodeValueFunction {
  (...args: any[]): any;
}

interface CodeValueObject {
  [key: string]: CodeValue;
}

/** Automatically provide modules when referenced */
class ProvidePlugin extends RspackBuiltinPlugin {
  name: "ProvidePlugin";
  constructor(options: ProvidePluginOptions);
}

type ProvidePluginOptions = Record<string, string | string[]>;

/** Show build progress */
class ProgressPlugin extends RspackBuiltinPlugin {
  name: "ProgressPlugin";
  constructor(options?: ProgressPluginArgument);
}

type ProgressPluginArgument = ProgressPluginOptions | 
  ((percentage: number, msg: string, ...args: any[]) => void);

interface ProgressPluginOptions {
  activeModules?: boolean;
  entries?: boolean;
  handler?: (percentage: number, msg: string, ...args: any[]) => void;
  modules?: boolean;
  modulesCount?: number;
  profile?: boolean;
  dependencies?: boolean;
  dependenciesCount?: number;
  percentBy?: "entries" | "modules" | "dependencies";
}

/** Add banner to bundles */
class BannerPlugin extends RspackBuiltinPlugin {
  name: "BannerPlugin";
  constructor(options: BannerPluginArgument);
}

type BannerPluginArgument = string | BannerPluginOptions;

interface BannerPluginOptions {
  banner: string | ((data: any) => string);
  entryOnly?: boolean;
  exclude?: string | RegExp | (string | RegExp)[];
  include?: string | RegExp | (string | RegExp)[];
  raw?: boolean;
  footer?: boolean;
  stage?: number;
  test?: string | RegExp | (string | RegExp)[];
}

Usage Examples:

import { DefinePlugin, HotModuleReplacementPlugin, ProvidePlugin } from "@rspack/core";

const config = {
  plugins: [
    // Define environment variables
    new DefinePlugin({
      "process.env.NODE_ENV": JSON.stringify("production"),
      "process.env.API_URL": JSON.stringify("https://api.example.com"),
      PRODUCTION: true,
      __VERSION__: JSON.stringify("1.0.0")
    }),

    // Enable HMR
    new HotModuleReplacementPlugin(),

    // Auto-provide modules
    new ProvidePlugin({
      $: "jquery",
      jQuery: "jquery",
      React: "react",
      process: "process/browser"
    }),

    // Show build progress
    new ProgressPlugin((percentage, message, ...args) => {
      console.log(`${Math.round(percentage * 100)}% ${message} ${args.join(" ")}`);
    })
  ]
};

Optimization Plugins

Plugins for code splitting, minification, and bundle optimization.

/** Configure code splitting */
class SplitChunksPlugin extends RspackBuiltinPlugin {
  name: "SplitChunksPlugin";
  constructor(options?: OptimizationSplitChunksOptions);
}

/** Extract runtime code into separate chunk */
class RuntimeChunkPlugin extends RspackBuiltinPlugin {
  name: "RuntimeChunkPlugin";
  constructor(options?: OptimizationRuntimeChunk);
}

/** Limit the number of chunks */
class LimitChunkCountPlugin extends RspackBuiltinPlugin {
  name: "LimitChunkCountPlugin";
  constructor(options?: { maxChunks?: number; chunkOverhead?: number; entryChunkMultiplicator?: number });
}

/** JavaScript minification using SWC */
class SwcJsMinimizerRspackPlugin extends RspackBuiltinPlugin {
  name: "SwcJsMinimizerRspackPlugin";
  constructor(options?: SwcJsMinimizerRspackPluginOptions);
}

interface SwcJsMinimizerRspackPluginOptions {
  test?: AssetConditions;
  exclude?: AssetConditions;
  include?: AssetConditions;
  extractComments?: ExtractCommentsOptions;
  minimizerOptions?: {
    minify?: boolean;
    ecma?: TerserEcmaVersion;
    compress?: TerserCompressOptions | boolean;
    mangle?: TerserMangleOptions | boolean;
    format?: JsFormatOptions;
    module?: boolean;
  };
}

type AssetConditions = string | RegExp | (string | RegExp)[];
type ExtractCommentsOptions = boolean | string | RegExp | ((node: any, comment: any) => boolean);
type TerserEcmaVersion = 5 | 2015 | 2016 | 2017 | 2018 | 2019 | 2020;

interface TerserCompressOptions {
  arguments?: boolean;
  arrows?: boolean;
  booleans?: boolean;
  booleans_as_integers?: boolean;
  collapse_vars?: boolean;
  comparisons?: boolean;
  computed_props?: boolean;
  conditionals?: boolean;
  dead_code?: boolean;
  defaults?: boolean;
  directives?: boolean;
  drop_console?: boolean;
  drop_debugger?: boolean;
  ecma?: TerserEcmaVersion;
  evaluate?: boolean;
  expression?: boolean;
  global_defs?: Record<string, any>;
  hoist_funs?: boolean;
  hoist_props?: boolean;
  hoist_vars?: boolean;
  if_return?: boolean;
  inline?: boolean | number;
  join_vars?: boolean;
  keep_classnames?: boolean | RegExp;
  keep_fargs?: boolean;
  keep_fnames?: boolean | RegExp;
  keep_infinity?: boolean;
  loops?: boolean;
  negate_iife?: boolean;
  passes?: number;
  properties?: boolean;
  pure_getters?: boolean | "strict";
  pure_funcs?: string[];
  reduce_funcs?: boolean;
  reduce_vars?: boolean;
  sequences?: boolean;
  side_effects?: boolean;
  switches?: boolean;
  top_retain?: string[] | string | RegExp;
  toplevel?: boolean;
  typeofs?: boolean;
  unsafe?: boolean;
  unsafe_arrows?: boolean;
  unsafe_comps?: boolean;
  unsafe_Function?: boolean;
  unsafe_math?: boolean;
  unsafe_symbols?: boolean;
  unsafe_methods?: boolean;
  unsafe_proto?: boolean;
  unsafe_regexp?: boolean;
  unsafe_undefined?: boolean;
  unused?: boolean;
}

interface TerserMangleOptions {
  eval?: boolean;
  keep_classnames?: boolean | RegExp;
  keep_fnames?: boolean | RegExp;
  module?: boolean;
  properties?: boolean | TerserManglePropertiesOptions;
  reserved?: string[];
  safari10?: boolean;
  toplevel?: boolean;
}

interface TerserManglePropertiesOptions {
  builtins?: boolean;
  debug?: boolean;
  keep_quoted?: boolean | "strict";
  regex?: RegExp | string;
  reserved?: string[];
}

interface JsFormatOptions {
  ascii_only?: boolean;
  beautify?: boolean;
  braces?: boolean;
  comments?: boolean | "all" | "some" | RegExp | ((node: any, comment: any) => boolean);
  ecma?: TerserEcmaVersion;
  indent_level?: number;
  indent_start?: number;
  inline_script?: boolean;
  keep_numbers?: boolean;
  keep_quoted_props?: boolean;
  max_line_len?: number | false;
  preamble?: string;
  preserve_annotations?: boolean;
  quote_keys?: boolean;
  quote_style?: 0 | 1 | 2 | 3;
  semicolons?: boolean;
  shebang?: boolean;
  webkit?: boolean;
  width?: number;
  wrap_iife?: boolean;
  wrap_func_args?: boolean;
}

/** CSS minification using Lightning CSS */
class LightningCssMinimizerRspackPlugin extends RspackBuiltinPlugin {
  name: "LightningCssMinimizerRspackPlugin";
  constructor(options?: LightningCssMinimizerRspackPluginOptions);
}

interface LightningCssMinimizerRspackPluginOptions {
  errorRecovery?: boolean;
  minimizerOptions?: any;
  test?: RegExp | RegExp[];
  include?: RegExp | RegExp[];
  exclude?: RegExp | RegExp[];
}

Asset Processing Plugins

Plugins for handling CSS, HTML, and other assets.

/** Extract CSS into separate files */
class CssExtractRspackPlugin extends RspackBuiltinPlugin {
  name: "CssExtractRspackPlugin";
  constructor(options?: CssExtractRspackPluginOptions);
}

interface CssExtractRspackPluginOptions {
  filename?: string;
  chunkFilename?: string;
  ignoreOrder?: boolean;
  insert?: string | ((linkTag: HTMLLinkElement) => void);
  attributes?: Record<string, string>;
  linkType?: string | false;
  runtime?: boolean;
}

/** Generate HTML files with bundle injection */
class HtmlRspackPlugin extends RspackBuiltinPlugin {
  name: "HtmlRspackPlugin";
  constructor(options?: HtmlRspackPluginOptions);
}

interface HtmlRspackPluginOptions {
  title?: string;
  filename?: string;
  template?: string;
  templateContent?: string | ((templateParameters: any) => string) | false;
  templateParameters?: any;
  inject?: boolean | "head" | "body";
  publicPath?: string;
  scriptLoading?: "blocking" | "defer" | "module";
  favicon?: string;
  meta?: Record<string, any>;
  base?: string | Record<string, any> | false;
  minify?: boolean | any;
  hash?: boolean;
  cache?: boolean;
  showErrors?: boolean;
  chunks?: string[];
  chunksSortMode?: string | ((a: any, b: any) => number);
  excludeChunks?: string[];
  xhtml?: boolean;
}

/** Copy files during build */
class CopyRspackPlugin extends RspackBuiltinPlugin {
  name: "CopyRspackPlugin";
  constructor(options: CopyRspackPluginOptions);
}

interface CopyRspackPluginOptions {
  patterns: CopyPattern[];
  options?: CopyGlobalOptions;
}

interface CopyPattern {
  from: string;
  to?: string;
  context?: string;
  globOptions?: any;
  filter?: (filepath: string) => boolean;
  transform?: (content: Buffer, path: string) => string | Buffer;
  transformPath?: (targetPath: string, absoluteFrom: string) => string;
  noErrorOnMissing?: boolean;
  info?: any;
}

interface CopyGlobalOptions {
  concurrency?: number;
}

Development and Debugging Plugins

Plugins for development workflow, debugging, and diagnostics.

/** Generate source maps */
class SourceMapDevToolPlugin extends RspackBuiltinPlugin {
  name: "SourceMapDevToolPlugin";
  constructor(options?: SourceMapDevToolPluginOptions);
}

interface SourceMapDevToolPluginOptions {
  filename?: string;
  append?: string;
  publicPath?: string;
  fileContext?: string;
  test?: string | RegExp | (string | RegExp)[];
  include?: string | RegExp | (string | RegExp)[];
  exclude?: string | RegExp | (string | RegExp)[];
  columns?: boolean;
  lineToLine?: boolean;
  noSources?: boolean;
  namespace?: string;
}

/** Eval-based source maps for development */
class EvalSourceMapDevToolPlugin extends RspackBuiltinPlugin {
  name: "EvalSourceMapDevToolPlugin";
  constructor(options?: any);
}

class EvalDevToolModulePlugin extends RspackBuiltinPlugin {
  name: "EvalDevToolModulePlugin";
  constructor(options?: EvalDevToolModulePluginOptions);
}

interface EvalDevToolModulePluginOptions {
  namespace?: string;
  moduleFilenameTemplate?: string;
}

/** Detect circular dependencies */
class CircularDependencyRspackPlugin extends RspackBuiltinPlugin {
  name: "CircularDependencyRspackPlugin";
  constructor(options?: CircularDependencyRspackPluginOptions);
}

interface CircularDependencyRspackPluginOptions {
  exclude?: RegExp;
  include?: RegExp;
  failOnError?: boolean;
  allowAsyncCycles?: boolean;
  cwd?: string;
}

Environment and External Plugins

Plugins for different target environments and external dependencies.

/** Configure externals */
class ExternalsPlugin extends RspackBuiltinPlugin {
  name: "ExternalsPlugin";
  constructor(type: string, externals: Externals);
}

type Externals = string | RegExp | ExternalsObjectElement | ExternalsArrayElement | 
  ExternalsFunction;

interface ExternalsObjectElement {
  [key: string]: string | boolean | string[] | ExternalsObjectElement;
}

type ExternalsArrayElement = string | RegExp | ExternalsObjectElement | ExternalsFunction;
type ExternalsFunction = (
  context: string,
  request: string,
  callback: (err?: Error, result?: string) => void
) => void;

/** Node.js target support */
class NodeTargetPlugin extends RspackBuiltinPlugin {
  name: "NodeTargetPlugin";
  constructor();
}

/** Electron target support */
class ElectronTargetPlugin extends RspackBuiltinPlugin {
  name: "ElectronTargetPlugin";
  constructor(context: "main" | "preload" | "renderer");
}

/** Web Worker template */
class WebWorkerTemplatePlugin extends RspackBuiltinPlugin {
  name: "WebWorkerTemplatePlugin";
  constructor();
}

/** Load environment variables */
class EnvironmentPlugin extends RspackBuiltinPlugin {
  name: "EnvironmentPlugin";
  constructor(keys: string[] | Record<string, any>);
}

Module ID Plugins

Plugins for controlling module and chunk ID generation.

/** Named module IDs for development */
class NamedModuleIdsPlugin extends RspackBuiltinPlugin {
  name: "NamedModuleIdsPlugin";
  constructor();
}

/** Named chunk IDs for development */
class NamedChunkIdsPlugin extends RspackBuiltinPlugin {
  name: "NamedChunkIdsPlugin";
  constructor();
}

/** Deterministic module IDs for production */
class DeterministicModuleIdsPlugin extends RspackBuiltinPlugin {
  name: "DeterministicModuleIdsPlugin";
  constructor();
}

/** Deterministic chunk IDs for production */
class DeterministicChunkIdsPlugin extends RspackBuiltinPlugin {
  name: "DeterministicChunkIdsPlugin";
  constructor();
}

/** Natural module IDs (numeric) */
class NaturalModuleIdsPlugin extends RspackBuiltinPlugin {
  name: "NaturalModuleIdsPlugin";
  constructor();
}

/** Natural chunk IDs (numeric) */
class NaturalChunkIdsPlugin extends RspackBuiltinPlugin {
  name: "NaturalChunkIdsPlugin";
  constructor();
}

/** Occurrence-based chunk IDs */
class OccurrenceChunkIdsPlugin extends RspackBuiltinPlugin {
  name: "OccurrenceChunkIdsPlugin";
  constructor();
}

Utility Plugins

Additional utility plugins for specific use cases.

/** Ignore files during compilation */
class IgnorePlugin extends RspackBuiltinPlugin {
  name: "IgnorePlugin";
  constructor(options: IgnorePluginOptions);
}

interface IgnorePluginOptions {
  checkResource?: (resource: string) => boolean;
  checkContext?: (context: string) => boolean;
  resourceRegExp?: RegExp;
  contextRegExp?: RegExp;
}

/** Prevent emitting on errors */
class NoEmitOnErrorsPlugin extends RspackBuiltinPlugin {
  name: "NoEmitOnErrorsPlugin";
  constructor();
}

/** Warn about case-sensitive modules */
class WarnCaseSensitiveModulesPlugin extends RspackBuiltinPlugin {
  name: "WarnCaseSensitiveModulesPlugin";
  constructor();
}

/** Replace modules based on context */
class ContextReplacementPlugin extends RspackBuiltinPlugin {
  name: "ContextReplacementPlugin";
  constructor(
    resourceRegExp: RegExp,
    newContentResource?: string,
    newContentRecursive?: boolean,
    newContentRegExp?: RegExp
  );
}

/** Replace normal modules */
class NormalModuleReplacementPlugin extends RspackBuiltinPlugin {
  name: "NormalModuleReplacementPlugin";
  constructor(
    resourceRegExp: RegExp,
    newResource: string | ((resource: any) => string)
  );
}

Plugin Usage Example:

import {
  DefinePlugin,
  HtmlRspackPlugin,
  CssExtractRspackPlugin,
  SwcJsMinimizerRspackPlugin,
  ProgressPlugin
} from "@rspack/core";

const config = {
  plugins: [
    new DefinePlugin({
      "process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV || "development")
    }),
    
    new HtmlRspackPlugin({
      title: "My App",
      template: "./src/index.html",
      filename: "index.html",
      inject: true,
      minify: process.env.NODE_ENV === "production"
    }),
    
    new CssExtractRspackPlugin({
      filename: "[name].[contenthash].css",
      chunkFilename: "[id].[contenthash].css"
    }),
    
    new ProgressPlugin(),
    
    ...(process.env.NODE_ENV === "production" ? [
      new SwcJsMinimizerRspackPlugin({
        minimizerOptions: {
          compress: true,
          mangle: true
        }
      })
    ] : [])
  ]
};

Critical Missing Plugins

The following critical plugins are available in @rspack/core but not yet documented above:

Module Federation Plugins

/** Main Module Federation plugin for complete micro-frontend setup */
class ModuleFederationPlugin extends RspackBuiltinPlugin {
  name: "ModuleFederationPlugin";
  constructor(options: ModuleFederationPluginOptions);
}

interface ModuleFederationPluginOptions {
  name: string;
  filename?: string;
  exposes?: Exposes;
  remotes?: Remotes;
  shared?: Shared;
  runtimePlugins?: string[];
  shareStrategy?: "version-first" | "loaded-first";
}

/** Container plugin for exposing modules */
class ContainerPlugin extends RspackBuiltinPlugin {
  name: "ContainerPlugin";
  constructor(options: ContainerPluginOptions);
}

interface ContainerPluginOptions {
  name: string;
  library?: LibraryOptions;
  filename?: string;
  runtime?: string | false;
  shareScope?: string;
  exposes: Exposes;
}

/** Container reference plugin for consuming remote modules */
class ContainerReferencePlugin extends RspackBuiltinPlugin {
  name: "ContainerReferencePlugin";
  constructor(options: ContainerReferencePluginOptions);
}

interface ContainerReferencePluginOptions {
  remoteType: string;
  shareScope?: string;
  remotes: Remotes;
}

DLL Plugins

/** Create a DLL bundle for commonly used dependencies */
class DllPlugin extends RspackBuiltinPlugin {
  name: "DllPlugin";
  constructor(options: DllPluginOptions);
}

interface DllPluginOptions {
  context?: string;
  format?: boolean;
  name?: string;
  path: string;
  entryOnly?: boolean;
  type?: string;
}

/** Reference a pre-built DLL bundle */
class DllReferencePlugin extends RspackBuiltinPlugin {
  name: "DllReferencePlugin";
  constructor(options: DllReferencePluginOptions);
}

interface DllReferencePluginOptions {
  context?: string;
  extensions?: string[];
  manifest: DllReferencePluginOptionsManifest;
  name?: string;
  scope?: string;
  sourceType?: DllReferencePluginOptionsSourceType;
  type?: string;
}

type DllReferencePluginOptionsSourceType = "var" | "assign" | "this" | "window" | "global" | "commonjs" | "commonjs2" | "commonjs-module" | "amd" | "umd" | "umd2" | "jsonp" | "system";

interface DllReferencePluginOptionsManifest {
  name?: string;
  type?: string;
  content: DllReferencePluginOptionsContent;
}

type DllReferencePluginOptionsContent = Record<string, { id: string | number; buildMeta?: Record<string, any>; }>;

Entry and Core Plugins

/** Add static entry points */
class EntryPlugin extends RspackBuiltinPlugin {
  name: "EntryPlugin";
  constructor(context: string, entry: string, options?: EntryOptions | string);
}

/** Add dynamic entry points at runtime */
class DynamicEntryPlugin extends RspackBuiltinPlugin {
  name: "DynamicEntryPlugin";
  constructor(context: string, entry: () => Promise<EntryNormalized> | EntryNormalized);
}

/** Security plugin for Subresource Integrity */
class SubresourceIntegrityPlugin extends RspackBuiltinPlugin {
  name: "SubresourceIntegrityPlugin";
  constructor(options?: SubresourceIntegrityPluginOptions);
}

interface SubresourceIntegrityPluginOptions {
  hashFuncNames?: ("sha256" | "sha384" | "sha512")[];
  enabled?: boolean;
}

Install with Tessl CLI

npx tessl i tessl/npm-rspack--core

docs

configuration.md

core-bundling.md

hmr.md

index.md

loaders.md

module-federation.md

plugins.md

tile.json