Plugin List

Plugin System

You can read about the functionality of Rsbuild plugins and how to develop an Rsbuild plugin in the Plugin System documentation.

Using Plugins

You can register Rsbuild plugins in the rsbuild.config.ts file using the plugins option. For more details, refer to plugins.

If you are using Rsbuild's JavaScript API, you can register the plugin using the addPlugins method.

Official Plugins

The following are official plugins that can be used in Rsbuild.

For React

Plugins available for the React framework:

For Vue

Plugins available for the Vue framework:

  • Vue Plugin: Provides support for Vue 3 SFC (Single File Components).
  • Vue JSX Plugin: Provides support for Vue 3 JSX / TSX syntax.
  • Vue2 Plugin: Provides support for Vue 2 SFC (Single File Components).
  • Vue2 JSX Plugin: Provides support for Vue 2 JSX / TSX syntax.

For Preact

Plugins available for the Preact framework:

For Svelte

Plugins available for the Svelte framework:

  • Svelte Plugin: Provides support for Svelte components (.svelte files).

For Solid

Plugins available for the Solid framework:

Common

The following are common framework-agnostic plugins:

  • Assets Retry Plugin: Used to automatically resend requests when static assets fail to load.
  • Babel Plugin: Provides support for Babel transpilation capabilities.
  • Sass Plugin: Use Sass as the CSS preprocessor.
  • Less Plugin: Use Less as the CSS preprocessor.
  • Stylus Plugin: Use Stylus as the CSS preprocessor.
  • Basic SSL Plugin: Generate an untrusted, self-signed certificate for the HTTPS server.
  • ESLint Plugin: Run ESLint checks during the compilation.
  • Type Check Plugin: Run TypeScript type checker on a separate process.
  • Image Compress Plugin: Compress the image assets.
  • MDX Plugin: Provide support for MDX.
  • Node Polyfill Plugin: Used to inject polyfills of Node core modules in the browser side.
  • Source Build Plugin: This plugin is designed for the monorepo scenario. It supports referencing source code from other subdirectories and performs build and hot update.
  • Check Syntax Plugin: Check the syntax compatibility of output files and determine if there are any advanced syntaxes that could cause compatibility issues.
  • CSS Minimizer Plugin: Used to customize CSS minimizer, switch to cssnano or other tools for CSS compression.
  • Typed CSS Modules Plugin: Generate TypeScript declaration file for CSS Modules.
  • Pug Plugin: Provides support for the Pug template engine.
  • Rem Plugin: Implements the rem adaptive layout for mobile pages.
  • UMD Plugin: Generate outputs in UMD format.
  • YAML Plugin: Import YAML files and convert them into JavaScript objects.
  • TOML Plugin: Import TOML files and convert them into JavaScript objects.
TIP

You can find the source code of all official plugins in web-infra-dev/rsbuild and rspack-contrib.

Community Plugins

You can check out the Rsbuild plugins provided by the community at awesome-rspack - Rsbuild Plugins.

You can also discover more Rsbuild plugins on npm by searching for the keyword rsbuild-plugin.