Rspack Plugin

Note

Requires Rspack version 0.5.0 or above.

  • Capable of building modules that meet the Module Federation loading specifications.
  • Can consume modules that adhere to the Module Federation specifications using aliases.
  • Can set shared dependency configurations for modules, so that when the host environment of the loaded module already has the corresponding dependency, it will not be loaded again.
  • When a module has remote types, it will automatically download and consume the types of the remote modules.
  • Consuming remote modules will have hot update capabilities.

Quick Start

Installation

You can install the plugin with the following commands:

npm
yarn
pnpm
bun
npm add @module-federation/enhanced

Create module-federation.config.ts

Create the module-federation.config.ts file with the following content:

module-federation.config.ts
import { createModuleFederationConfig } from '@module-federation/enhanced/rspack';

export default createModuleFederationConfig({
  name: 'host',
  remotes: {
    provider: 'provider@http://localhost:2004/mf-manifest.json',
  },
  exposes: {
    './Button': './src/components/Button.tsx',
  },
  shared: {
    react: {
      singleton: true,
    },
    'react-dom': {
      singleton: true,
    },
  },
});

Register Plugin

In Rspack, you can add plugins through the plugins configuration item:

rspack.config.ts
import { ModuleFederationPlugin } from '@module-federation/enhanced/rspack';
import mfConfig from './module-federation.config';

export default defineConfig({
  plugins: [new ModuleFederationPlugin(mfConfig)],
});

Configuration

You can find detailed descriptions of all configuration items on the Config Overview page.