# Rsbuild
帮助用户快速在 **Rsbuild App** 或 **Rslib** 中构建 Module Federation 产物
## 快速开始
### 安装
你可以通过如下的命令安装插件：
```sh [npm]
npm add @module-federation/rsbuild-plugin --save-dev
```
```sh [yarn]
yarn add @module-federation/rsbuild-plugin --save-dev
```
```sh [pnpm]
pnpm add @module-federation/rsbuild-plugin --save-dev
```
```sh [bun]
bun add @module-federation/rsbuild-plugin --save-dev
```
### 注册插件
#### Rsbuild App
```ts title='rsbuild.config.ts'
import { pluginModuleFederation } from '@module-federation/rsbuild-plugin';
import { defineConfig } from '@rsbuild/core';
import { pluginReact } from '@rsbuild/plugin-react';
export default defineConfig({
server: {
port: 2000,
},
plugins: [
pluginReact(),
pluginModuleFederation({
name: 'federation_consumer',
remotes: {
remote1: 'remote1@http://localhost:2001/mf-manifest.json',
},
shared: ['react', 'react-dom'],
}),
],
});
```
#### Rslib Module
```ts title='rslib.config.ts'
import { pluginModuleFederation } from '@module-federation/rsbuild-plugin';
import { defineConfig } from '@rslib/core';
export default defineConfig({
lib: [
// ...
{
format: 'mf',
output: {
distPath: {
root: './dist/mf',
},
assetPrefix: 'xxx',
},
plugins: [
// ...
pluginModuleFederation({
name: 'rslib_provider',
exposes: {
'.': './src/index.tsx',
},
shared: {
react: {
singleton: true,
},
'react-dom': {
singleton: true,
},
},
}),
],
},
],
});
```
### 注意
如果需要使用 Module Federation 运行时能力，请安装 [@module-federation/enhanced](/zh/guide/runtime/index.md)
## 配置
- 类型：
```ts
export declare const pluginModuleFederation: (moduleFederationOptions: ModuleFederationOptions, rsbuildOptions?: RSBUILD_PLUGIN_OPTIONS) => RsbuildPlugin;
type RSBUILD_PLUGIN_OPTIONS = {
ssr?: boolean;
}
```
### moduleFederationOptions
[Module Federation 配置项](/configure/index.md)
### rsbuildOptions
Rsbuild 插件额外配置。
#### target
:::tip
仅支持 Rslib 全局插件。
:::
- 类型：`'web' | 'node' | 'dual'`
- 默认值：`'web'`
用于指定产物的运行目标环境。当设置为 `dual` 时，会同时构建 Web（浏览器）产物与 Node.js（SSR）产物。
使用 `target: 'dual'` 生成 SSR 产物后，可参考 [创建 Modern.js 消费者](/practice/frameworks/modern/index.md) 创建消费者，并接入对应的 Rslib SSR 生产者进行开发。
#### ssr
:::danger 废弃警告
该配置项已废弃，请使用 [target: 'dual'](#target) 来开启 SSR 功能。
:::
- 类型：`boolean`
- 默认值：`false`
开启后可以生成 SSR 产物。
