# Rspress
:::info Note
Requires [Rspress version 2.0.0-beta.16](https://v2.rspress.rs/plugin/system/introduction) or higher.
:::
Helps users build and consume {props.name || 'Module Federation'} products in **Rspress**.
## Quick Start
{props.demo}
### Installation
You can install the plugin with the following command:
```sh [npm]
npm add @module-federation/rspress-plugin
```
```sh [yarn]
yarn add @module-federation/rspress-plugin
```
```sh [pnpm]
pnpm add @module-federation/rspress-plugin
```
```sh [bun]
bun add @module-federation/rspress-plugin
```
### Create {props.configName || 'module-federation.config.ts'}
Create the {props.configName || 'module-federation.config.ts'} file with the following content:
{props.createConfig || <CreateConfig />}
### Register Plugin
{props.registerPlugin || React.createElement(RegisterPlugin)}
### Loading Document Fragments
You can directly load exported document fragments in your `mdx` files.
```mdx title='docs/en/guide/intro.mdx'
import Intro from 'mf-doc/intro-zh';
{/* Document fragments support passing parameters, which are consumed as props. */}
<Intro cmdTools={['a','b']} />
```
Document fragments support passing parameters, which are consumed as props.
If you need to use the `cmdTools` variable in a document fragment, you can refer to the following:
```mdx title='docs/zh/guide/intro.mdx'
{(props.cmdTools || ['pkg-a', 'pkg-b']).map(cmdTool=>(<code>{cmdTool}</code>))}
```
## Configuration
- Type:
{props.configType || <ConfigType />}
### {props.pluginOptionName || 'moduleFederationOptions'}
[{props.name || 'Module Federation'} Configuration](/configure/index.md)
### rspressOptions
Additional configuration for the Rspress plugin.
#### autoShared
- Type: `boolean`
- Default: `true`
Rspress uses `react`, `react-dom`, and `@mdx-js/react` as third-party dependencies. These three dependencies need to be singletons, so the `shared` configuration is automatically injected during the build.
You can also set `autoShared: false` to disable this behavior.
Default `shared` configuration: as follows:
```json
react: {
singleton: true,
requiredVersion: false,
},
'react-dom': {
singleton: true,
requiredVersion: false,
},
'react/': {
singleton: true,
requiredVersion: false,
},
'react-dom/': {
singleton: true,
requiredVersion: false,
},
'@mdx-js/react': {
singleton: true,
requiredVersion: false
},
'@rspress/core/runtime': {
singleton: true,
requiredVersion: false
}
```
#### rebuildSearchIndex
- Type: `boolean`
- Default: `true`
Rspress automatically generates a search index during the build, but the generation process only supports `.mdx` or `.md` files. Therefore, when a Module Federation document fragment is loaded, it will not be searchable.
To avoid this, the MF Rspress Plugin will regenerate the search index based on the rendered `html` after SSG is complete to support the search function.
If you are using remoteSearch or other search functions, you can set `rebuildSearchIndex: false` to disable this behavior.
> Note: This feature is only effective in ssg mode.
## FAQ
### Does it support local search?
Only `ssg` mode is supported. For details, refer to [rebuildSearchIndex](#rebuildsearchindex).
### Could not parse expression with swc: Expression expected"
When referencing an MDX component, you may encounter the following error:
```bash
File: "/root/docs/zh/guide/basic/mf.mdx"
Error: "23:8: Could not parse expression with swc: Expression expected"
```
This is an issue where Rspress fails to parse the expression correctly when parsing the MDX component. It can be resolved as follows:
```diff
import RemoteIntroDoc from 'mf-doc/intro';
import Head from '@components/Head';
+ import React from 'react';
- <RemoteIntroDoc head={<Head />} />
+ <RemoteIntroDoc head={React.createElement(Head)}/>
```
