# runtimePlugins
- Type: `string[] | Array<[string, Record<string, unknown>]>`
- Required: No
- Default: `undefined`
The `runtimePlugins` configuration is used to add additional plugins needed at runtime. The value can be:
- A string representing the path to the specific plugin (absolute/relative path or package name)
- An array where each element can be either a string or a tuple with \[string path, object options]
You can learn more about how to develop `runtimePlugin` details by visiting the [Plugin System](/plugin/dev/index.md).
Once set, runtime plugins will be automatically injected and used during the build process.
- Examples
**Basic usage:**
To create a runtime plugin file, you can name it `custom-runtime-plugin.ts`:
```ts title="custom-runtime-plugin.ts"
import { ModuleFederationRuntimePlugin } from '@module-federation/enhanced/runtime';
export default function (): ModuleFederationRuntimePlugin {
return {
name: 'custom-plugin-build',
beforeInit(args) {
console.log('[build time inject] beforeInit: ', args);
return args;
},
beforeLoadShare(args) {
console.log('[build time inject] beforeLoadShare: ', args);
return args;
},
};
}
```
Then, apply this plugin in your build configuration:
```ts title="rspack.config.ts"
const path = require('path');
module.exports = {
plugins: [
new ModuleFederationPlugin({
name: 'host',
remotes: {
'manifest-provider':
'manifest_provider@http://localhost:3011/mf-manifest.json',
},
runtimePlugins: [path.resolve(__dirname, './custom-runtime-plugin.ts')],
}),
],
};
```
**With options:**
You can also provide options to runtime plugins by using a tuple format:
```ts title="rspack.config.ts"
const path = require('path');
module.exports = {
plugins: [
new ModuleFederationPlugin({
name: 'host',
remotes: {
'manifest-provider':
'manifest_provider@http://localhost:3011/mf-manifest.json',
},
runtimePlugins: [
path.resolve(__dirname, './custom-runtime-plugin.ts'),
[
path.resolve(__dirname, './another-plugin.ts'),
{
debug: true,
timeout: 5000,
customConfig: 'value'
}
]
],
}),
],
};
```
The plugin can then access these options:
```ts title="another-plugin.ts"
import { ModuleFederationRuntimePlugin } from '@module-federation/enhanced/runtime';
export default function (options: any): ModuleFederationRuntimePlugin {
console.log('Plugin options:', options);
return {
name: 'another-plugin',
beforeInit(args) {
if (options.debug) {
console.log('[debug] beforeInit: ', args);
}
return args;
},
};
}
```
