Rspack

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.

#Rspack

#Quick Start

#Installation

#Create module-federation.config.ts