简体中文

模块联邦

Rsbuild 团队与 Module Federation 的开发团队密切合作，并为 Module Federation 提供一流的支持。

什么是模块联邦

Module Federation 是一种 JavaScript 应用分治的架构模式（类似于服务端的微服务），它允许你在多个 JavaScript 应用程序（或微前端）之间共享代码和资源。这可以帮助你：

减少代码重复
提高代码可维护性
降低应用程序的整体大小
提高应用程序的性能

如何使用

Module Federation 目前有两个主要版本，你可以选择其中一个使用：

Module Federation v1.5

这是 Rspack 内置支持的基础版本，提供模块导出、模块加载、依赖共享等能力。

你可以通过 Rsbuild 的 moduleFederation.options 来使用它，无须安装任何插件。

rsbuild.config.ts

export default defineConfig({
  moduleFederation: {
    options: {
      name: 'remote',
      // other options
    },
  },
});

Module Federation v2.0

这是 Module Federation 的增强版本。它在 Module Federation v1.5 的基础上，提供了额外的功能，比如动态类型提示、manifest、federation runtime、runtime plugin system 等，这些功能让 Module Federation 更适用于支持大型 Web 应用的微前端架构。

你需要安装额外的 @module-federation/enhanced 插件，才能使用 Module Federation v2.0。

rsbuild.config.ts

import { ModuleFederationPlugin } from '@module-federation/enhanced/rspack';

export default defineConfig({
  tools: {
    rspack: (config, { appendPlugins }) => {
      appendPlugins([
        new ModuleFederationPlugin({
          name: 'provider',
          // other options
        }),
      ]);
    },
  },
});

请参考 Module Federation v2.0 官方文档来了解具体的用法。

示例仓库

Rsbuild 提供了一些 Module Federation 的示例项目，你可以参考：

模块联邦#

什么是模块联邦#

如何使用#

Module Federation v1.5#