From 0a4b4b4e07f141c55133f7a7aba299f936e9042e Mon Sep 17 00:00:00 2001 From: ScriptedAlchemy Date: Tue, 15 Apr 2025 14:27:00 -0700 Subject: [PATCH 1/3] perf: disable live bindings on commonjs --- apps/website-new/docs/en/configure/dev.mdx | 5 +++ apps/website-new/docs/en/configure/dts.mdx | 5 +++ .../docs/en/configure/experiments.mdx | 5 +++ .../website-new/docs/en/configure/exposes.mdx | 5 +++ .../docs/en/configure/filename.mdx | 5 +++ .../docs/en/configure/getpublicpath.mdx | 5 +++ .../docs/en/configure/implementation.mdx | 5 +++ apps/website-new/docs/en/configure/index.mdx | 5 +++ .../docs/en/configure/manifest.mdx | 5 +++ apps/website-new/docs/en/configure/name.mdx | 5 +++ .../website-new/docs/en/configure/remotes.mdx | 5 +++ .../docs/en/configure/runtimeplugins.mdx | 5 +++ .../docs/en/configure/shareStrategy.mdx | 5 +++ apps/website-new/docs/en/configure/shared.mdx | 5 +++ .../docs/en/guide/basic/chrome-devtool.mdx | 5 ++- apps/website-new/docs/en/guide/basic/cli.mdx | 7 ++- .../docs/en/guide/basic/rsbuild.mdx | 5 ++- .../docs/en/guide/basic/rspack.mdx | 5 ++- .../docs/en/guide/basic/runtime.mdx | 5 +++ .../docs/en/guide/basic/type-prompt.mdx | 5 +++ apps/website-new/docs/en/guide/basic/vite.mdx | 7 ++- .../docs/en/guide/basic/webpack.mdx | 5 +++ .../docs/en/guide/framework/modernjs.mdx | 5 +++ .../docs/en/guide/framework/nextjs.mdx | 5 +++ .../docs/en/guide/start/features.mdx | 5 +++ .../docs/en/guide/start/glossary.mdx | 5 +++ .../website-new/docs/en/guide/start/index.mdx | 5 +++ .../docs/en/guide/start/npm-packages.mdx | 5 +++ .../docs/en/guide/start/quick-start.mdx | 5 +++ .../docs/en/guide/start/setting-up-env.mdx | 5 +++ packages/error-codes/rollup.config.js | 4 ++ packages/runtime-core/rollup.config.cjs | 4 ++ .../rollup.config.cjs | 4 ++ packages/runtime-tools/rollup.config.cjs | 44 ++++++++++++------- 34 files changed, 187 insertions(+), 23 deletions(-) diff --git a/apps/website-new/docs/en/configure/dev.mdx b/apps/website-new/docs/en/configure/dev.mdx index 5f62fb4219f..c1aeb71b5eb 100644 --- a/apps/website-new/docs/en/configure/dev.mdx +++ b/apps/website-new/docs/en/configure/dev.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | Dev Configuration +description: Configure Module Federation development-time behaviors, including live reload and type hint reloading. +--- + # dev - Type: `boolean | PluginDevOptions` diff --git a/apps/website-new/docs/en/configure/dts.mdx b/apps/website-new/docs/en/configure/dts.mdx index 3f1fbf30d45..d2fe79d64f4 100644 --- a/apps/website-new/docs/en/configure/dts.mdx +++ b/apps/website-new/docs/en/configure/dts.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | DTS Configuration +description: Configure the generation and consumption of TypeScript definition (`.d.ts`) files for Module Federation. +--- + # dts - Type: `boolean | PluginDtsOptions` diff --git a/apps/website-new/docs/en/configure/experiments.mdx b/apps/website-new/docs/en/configure/experiments.mdx index 190302a504d..e7f55b75455 100644 --- a/apps/website-new/docs/en/configure/experiments.mdx +++ b/apps/website-new/docs/en/configure/experiments.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | Experiments Configuration +description: Enable and configure experimental features within the Module Federation plugin. +--- + # Experiments The `experiments` configuration is used to enable experimental capabilities in the plugin. diff --git a/apps/website-new/docs/en/configure/exposes.mdx b/apps/website-new/docs/en/configure/exposes.mdx index 3864929c17d..81a7e71f52a 100644 --- a/apps/website-new/docs/en/configure/exposes.mdx +++ b/apps/website-new/docs/en/configure/exposes.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | Exposes Configuration +description: Define the modules and file entries exposed by a Module Federation producer application. +--- + # Exposes - Type: `PluginExposesOptions` diff --git a/apps/website-new/docs/en/configure/filename.mdx b/apps/website-new/docs/en/configure/filename.mdx index 06d36fecfb0..635c6f0919d 100644 --- a/apps/website-new/docs/en/configure/filename.mdx +++ b/apps/website-new/docs/en/configure/filename.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | Filename Configuration +description: Specify the output filename for the Module Federation remote entry file (e.g., remoteEntry.js). +--- + # Filename - Type: `string` diff --git a/apps/website-new/docs/en/configure/getpublicpath.mdx b/apps/website-new/docs/en/configure/getpublicpath.mdx index 95874e167f8..4528f7b3ec6 100644 --- a/apps/website-new/docs/en/configure/getpublicpath.mdx +++ b/apps/website-new/docs/en/configure/getpublicpath.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | GetPublicPath Configuration +description: Configure a dynamic public path function for Module Federation remote modules. +--- + # GetPublicPath - Type: `string` diff --git a/apps/website-new/docs/en/configure/implementation.mdx b/apps/website-new/docs/en/configure/implementation.mdx index 1ba27a7ed87..d9e37bd6839 100644 --- a/apps/website-new/docs/en/configure/implementation.mdx +++ b/apps/website-new/docs/en/configure/implementation.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | Implementation Configuration +description: Specify a custom implementation path for the Module Federation runtime tools. +--- + # Implementation - Type: `string` diff --git a/apps/website-new/docs/en/configure/index.mdx b/apps/website-new/docs/en/configure/index.mdx index 8e2c76c371e..04a2f1cf322 100644 --- a/apps/website-new/docs/en/configure/index.mdx +++ b/apps/website-new/docs/en/configure/index.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | Configuration Overview +description: A comprehensive overview of all available configuration options for the Module Federation plugin. +--- + # Configuration Overview The current page lists all the configuration options for `Module Federation`. Please refer to the documentation for [`Rspack Plugin`](../guide/basic/rspack) and [`Webpack Plugin`](../guide/basic/webpack) and [`Vite Plugin`](../guide/basic/vite) to understand how to use them. diff --git a/apps/website-new/docs/en/configure/manifest.mdx b/apps/website-new/docs/en/configure/manifest.mdx index 6d99b0f3a96..2aded8fdb89 100644 --- a/apps/website-new/docs/en/configure/manifest.mdx +++ b/apps/website-new/docs/en/configure/manifest.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | Manifest Configuration +description: Configure the generation of the Module Federation manifest file (`mf-manifest.json`). +--- + # manifest - Type: `boolean | PluginManifestOptions` diff --git a/apps/website-new/docs/en/configure/name.mdx b/apps/website-new/docs/en/configure/name.mdx index 40c64106aa8..dddccc70c06 100644 --- a/apps/website-new/docs/en/configure/name.mdx +++ b/apps/website-new/docs/en/configure/name.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | Name Configuration +description: Define the unique name for the Module Federation application or module. +--- + # Name - Type: `string` diff --git a/apps/website-new/docs/en/configure/remotes.mdx b/apps/website-new/docs/en/configure/remotes.mdx index 6728109cbb5..388c768f276 100644 --- a/apps/website-new/docs/en/configure/remotes.mdx +++ b/apps/website-new/docs/en/configure/remotes.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | Remotes Configuration +description: Configure remote Module Federation applications or modules to be consumed. +--- + # Remotes - Type: `PluginRemoteOptions` diff --git a/apps/website-new/docs/en/configure/runtimeplugins.mdx b/apps/website-new/docs/en/configure/runtimeplugins.mdx index 9235630ca6a..5280553f093 100644 --- a/apps/website-new/docs/en/configure/runtimeplugins.mdx +++ b/apps/website-new/docs/en/configure/runtimeplugins.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | RuntimePlugins Configuration +description: Add custom plugins to extend or modify the Module Federation runtime behavior. +--- + # runtimePlugins - Type: `string[]` diff --git a/apps/website-new/docs/en/configure/shareStrategy.mdx b/apps/website-new/docs/en/configure/shareStrategy.mdx index 07a3850b129..e05d42ca33c 100644 --- a/apps/website-new/docs/en/configure/shareStrategy.mdx +++ b/apps/website-new/docs/en/configure/shareStrategy.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | ShareStrategy Configuration +description: Define the loading strategy (`version-first` or `loaded-first`) for shared dependencies in Module Federation. +--- + # shareStrategy - Type: `'version-first' | 'loaded-first'` diff --git a/apps/website-new/docs/en/configure/shared.mdx b/apps/website-new/docs/en/configure/shared.mdx index 9be6d34233a..5e012723ff9 100644 --- a/apps/website-new/docs/en/configure/shared.mdx +++ b/apps/website-new/docs/en/configure/shared.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Options | Shared Configuration +description: Configure shared dependencies between Module Federation applications to optimize performance and ensure consistency. +--- + # Shared The `shared` configuration is used to share common dependencies between consumers and producers, reducing the runtime download volume and thus improving performance. `shared` allows you to configure rules for reusing dependency versions. You can learn more about the scenarios where `shared` is applicable and how to use `shared` through the [FAQ](#faq). diff --git a/apps/website-new/docs/en/guide/basic/chrome-devtool.mdx b/apps/website-new/docs/en/guide/basic/chrome-devtool.mdx index bfac45685fe..92e6e62291e 100644 --- a/apps/website-new/docs/en/guide/basic/chrome-devtool.mdx +++ b/apps/website-new/docs/en/guide/basic/chrome-devtool.mdx @@ -1,4 +1,7 @@ -# Chrome DevTools +--- +title: Module Federation Chrome DevTools | Debugging and Development Tools +description: Learn how to use Chrome DevTools with Module Federation for debugging, inspecting dependencies, and monitoring module loading. +--- The `Microfrontend` architecture differs from the traditional monolithic application development model. Its characteristics of separate development, deployment, and debugging necessitate a new set of debugging tools to meet new usage scenarios, such as: how to verify the effect of modules in actual projects when developing `Module Federation`, whether the dependencies of `Module Federation` are reused with the host environment, which `Module Federation` modules are loaded on the current page, the dependency relationships of `Module Federation`, and how the data flow between `Module Federation` works. diff --git a/apps/website-new/docs/en/guide/basic/cli.mdx b/apps/website-new/docs/en/guide/basic/cli.mdx index fd9ce752a95..7d4d49867bb 100644 --- a/apps/website-new/docs/en/guide/basic/cli.mdx +++ b/apps/website-new/docs/en/guide/basic/cli.mdx @@ -1,4 +1,7 @@ -# CLI +--- +title: Module Federation CLI | Command Line Interface Guide +description: Comprehensive guide to using the Module Federation CLI for project creation, management, and development workflows. +--- `@module-federation/enhanced` and `@module-federation/modern-js` provides a lightweight CLI. @@ -61,4 +64,4 @@ The `mf dts` command will automatically generate or pull type declaration files If you only use the runtime API, you need to create a temporary `module-federation.config.ts` file, write the remote configuration you need to get the type, and then run the `mf dts` command. If you are only using the runtime API, you need to create a temporary `module-federation.config.ts` file, configure [dts.consumeTypes.remoteTypeUrls](../../configure/dts#remotetypeurls), and then run the `mf dts` command. -::: \ No newline at end of file +::: diff --git a/apps/website-new/docs/en/guide/basic/rsbuild.mdx b/apps/website-new/docs/en/guide/basic/rsbuild.mdx index 58df77a26ef..7796c9d51b0 100644 --- a/apps/website-new/docs/en/guide/basic/rsbuild.mdx +++ b/apps/website-new/docs/en/guide/basic/rsbuild.mdx @@ -1,4 +1,7 @@ -# Rsbuild Plugin +--- +title: Module Federation Rsbuild Plugin | Build Tool Integration +description: Learn how to integrate Module Federation with Rsbuild, including configuration options and best practices for micro-frontend development. +--- Help users quickly build Module Federation products in **Rsbuild App** or **Rslib** diff --git a/apps/website-new/docs/en/guide/basic/rspack.mdx b/apps/website-new/docs/en/guide/basic/rspack.mdx index 746fe13811f..9ff5cd93faf 100644 --- a/apps/website-new/docs/en/guide/basic/rspack.mdx +++ b/apps/website-new/docs/en/guide/basic/rspack.mdx @@ -1,4 +1,7 @@ -# Rspack Plugin +--- +title: Module Federation Rspack Plugin | High-Performance Build Integration +description: Guide to using Module Federation with Rspack, leveraging its high-performance build capabilities for micro-frontend applications. +--- :::info Note Requires Rspack version 0.5.0 or above. diff --git a/apps/website-new/docs/en/guide/basic/runtime.mdx b/apps/website-new/docs/en/guide/basic/runtime.mdx index d83a4310718..cdf2bf069b3 100644 --- a/apps/website-new/docs/en/guide/basic/runtime.mdx +++ b/apps/website-new/docs/en/guide/basic/runtime.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation Runtime | Core Runtime System +description: Comprehensive guide to the Module Federation runtime system, including module loading, sharing, and runtime plugin capabilities. +--- + # Federation Runtime :::tip diff --git a/apps/website-new/docs/en/guide/basic/type-prompt.mdx b/apps/website-new/docs/en/guide/basic/type-prompt.mdx index a9897f7fb5e..0145b4ac24f 100644 --- a/apps/website-new/docs/en/guide/basic/type-prompt.mdx +++ b/apps/website-new/docs/en/guide/basic/type-prompt.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation Type Hints | TypeScript Integration Guide +description: Learn how to use Module Federation's type hinting system for improved TypeScript support and development experience. +--- + # Remote Type Hints Just like NPM Packages, `Module Federation` products also generate types and enjoy type hot reloading, although the products are hosted on a remote CDN. diff --git a/apps/website-new/docs/en/guide/basic/vite.mdx b/apps/website-new/docs/en/guide/basic/vite.mdx index 2d3ca33e4b5..e8753055767 100644 --- a/apps/website-new/docs/en/guide/basic/vite.mdx +++ b/apps/website-new/docs/en/guide/basic/vite.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation Vite Plugin | Fast Development Integration +description: Guide to integrating Module Federation with Vite for fast development and optimized builds in micro-frontend applications. +--- + # Vite Plugin - Can build modules that meet the `Module Federation` loading specifications. @@ -10,7 +15,7 @@ Except for the [dev、dts](../../configure/dev.html) options, all options are su - roadmap 🗓️ - 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. - - nuxt ssr + - nuxt ssr ## Quick Start diff --git a/apps/website-new/docs/en/guide/basic/webpack.mdx b/apps/website-new/docs/en/guide/basic/webpack.mdx index 50c79e3e7c8..ee60f52edf4 100644 --- a/apps/website-new/docs/en/guide/basic/webpack.mdx +++ b/apps/website-new/docs/en/guide/basic/webpack.mdx @@ -1,3 +1,8 @@ +--- +title: Webpack Plugin +description: Configuring and using the Module Federation plugin within Webpack build environments. +--- + # Webpack Plugin - Can build modules that meet the `Module Federation` loading specifications. diff --git a/apps/website-new/docs/en/guide/framework/modernjs.mdx b/apps/website-new/docs/en/guide/framework/modernjs.mdx index f228d41e95e..e1ade0b535c 100644 --- a/apps/website-new/docs/en/guide/framework/modernjs.mdx +++ b/apps/website-new/docs/en/guide/framework/modernjs.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation Modern.js Plugin | Framework Integration Guide +description: Learn how to integrate Module Federation with Modern.js for building scalable micro-frontend applications. +--- + # Modern.js This plugin provides Module Federation supporting functions for Modern.js diff --git a/apps/website-new/docs/en/guide/framework/nextjs.mdx b/apps/website-new/docs/en/guide/framework/nextjs.mdx index 352ec9f27da..52d9f524b14 100644 --- a/apps/website-new/docs/en/guide/framework/nextjs.mdx +++ b/apps/website-new/docs/en/guide/framework/nextjs.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation Next.js Plugin | SSR Framework Integration +description: Comprehensive guide to using Module Federation with Next.js, including Server-Side Rendering and static site generation support. +--- + import { Badge } from '@theme';
diff --git a/apps/website-new/docs/en/guide/start/features.mdx b/apps/website-new/docs/en/guide/start/features.mdx index f90e4f4d928..d9b791752a5 100644 --- a/apps/website-new/docs/en/guide/start/features.mdx +++ b/apps/website-new/docs/en/guide/start/features.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation Features | Comprehensive Feature Guide +description: Explore the advanced capabilities of Module Federation 2.0, including runtime plugins, manifest support, dynamic type hints, and framework integrations. +--- + # Feature Navigation Here, you will discover the key functionalities offered through Module Federation. This version of Module Federation, distinct from those integrated into Webpack and Rspack, leverages the advanced features of the bundler tool. It offers enhanced capabilities designed to fulfill more demanding requirements of large-scale application development. diff --git a/apps/website-new/docs/en/guide/start/glossary.mdx b/apps/website-new/docs/en/guide/start/glossary.mdx index a213fe7a44d..57fd3505281 100644 --- a/apps/website-new/docs/en/guide/start/glossary.mdx +++ b/apps/website-new/docs/en/guide/start/glossary.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation Glossary | Terminology Reference Guide +description: Comprehensive glossary of Module Federation terms and concepts, including producers, consumers, micro-frontends, and bundler definitions. +--- + # Glossary of Terms ## Module Federation diff --git a/apps/website-new/docs/en/guide/start/index.mdx b/apps/website-new/docs/en/guide/start/index.mdx index ca5a9d0a2a2..2a8411f6747 100644 --- a/apps/website-new/docs/en/guide/start/index.mdx +++ b/apps/website-new/docs/en/guide/start/index.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation 2.0 | Introduction to Micro-Frontend Architecture +description: Learn about Module Federation 2.0, a powerful architecture pattern for building micro-frontends with enhanced features like runtime plugins, manifest support, and dynamic type hints. +--- + # Introduction ### 💡 What is Module Federation? diff --git a/apps/website-new/docs/en/guide/start/npm-packages.mdx b/apps/website-new/docs/en/guide/start/npm-packages.mdx index 1bf58738993..799c1daf1a3 100644 --- a/apps/website-new/docs/en/guide/start/npm-packages.mdx +++ b/apps/website-new/docs/en/guide/start/npm-packages.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation NPM Packages | Complete Package Ecosystem +description: Comprehensive guide to all Module Federation NPM packages, including enhanced core, runtime, Rspack plugin, Next.js integration, and utility packages. +--- + # npm Packages This document showcases all npm package information maintained by the Module Federation team. diff --git a/apps/website-new/docs/en/guide/start/quick-start.mdx b/apps/website-new/docs/en/guide/start/quick-start.mdx index e30c6bf8c0f..832757270b6 100644 --- a/apps/website-new/docs/en/guide/start/quick-start.mdx +++ b/apps/website-new/docs/en/guide/start/quick-start.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation Quick Start | Getting Started Guide +description: Step-by-step guide to setting up your first Module Federation project, including creating providers and consumers with modern build tools. +--- + import { Badge, PackageManagerTabs } from "@theme"; # Quick Start Guide diff --git a/apps/website-new/docs/en/guide/start/setting-up-env.mdx b/apps/website-new/docs/en/guide/start/setting-up-env.mdx index e2189734cea..6c43b9cd1fb 100644 --- a/apps/website-new/docs/en/guide/start/setting-up-env.mdx +++ b/apps/website-new/docs/en/guide/start/setting-up-env.mdx @@ -1,3 +1,8 @@ +--- +title: Module Federation Environment Setup | Prerequisites Guide +description: Complete guide to setting up your development environment for Module Federation, including Node.js requirements and essential web development prerequisites. +--- + # Setting Up the Environment Module Federation is a JavaScript application partitioning architecture pattern (similar to microservices on the server side) that allows you to share code and resources between multiple JavaScript applications (or micro frontends). This document is aimed at beginner users and will guide you through setting up the basic environment for Module Federation. diff --git a/packages/error-codes/rollup.config.js b/packages/error-codes/rollup.config.js index 5f856f1fe18..af567454a1f 100644 --- a/packages/error-codes/rollup.config.js +++ b/packages/error-codes/rollup.config.js @@ -11,6 +11,7 @@ module.exports = (rollupConfig, projectOptions) => { c.format === 'esm' ? c.chunkFileNames.replace('.js', '.mjs') : c.chunkFileNames, + ...(c.format === 'cjs' ? { externalLiveBindings: false } : {}), })); } else { rollupConfig.output = { @@ -25,6 +26,9 @@ module.exports = (rollupConfig, projectOptions) => { rollupConfig.output.format === 'esm' ? rollupConfig.output.chunkFileNames.replace('.js', '.mjs') : rollupConfig.output.chunkFileNames, + ...(rollupConfig.output.format === 'cjs' + ? { externalLiveBindings: false } + : {}), }; } diff --git a/packages/runtime-core/rollup.config.cjs b/packages/runtime-core/rollup.config.cjs index 6b3bbb6eef7..21a1dc769a5 100644 --- a/packages/runtime-core/rollup.config.cjs +++ b/packages/runtime-core/rollup.config.cjs @@ -36,6 +36,7 @@ module.exports = (rollupConfig, projectOptions) => { c.format === 'cjs' ? c.chunkFileNames.replace('.js', '.cjs') : c.chunkFileNames, + ...(c.format === 'cjs' ? { externalLiveBindings: false } : {}), })); } else { rollupConfig.output = { @@ -54,6 +55,9 @@ module.exports = (rollupConfig, projectOptions) => { rollupConfig.output.format === 'cjs' ? rollupConfig.output.chunkFileNames.replace('.js', '.cjs') : rollupConfig.output.chunkFileNames, + ...(rollupConfig.output.format === 'cjs' + ? { externalLiveBindings: false } + : {}), }; } diff --git a/packages/runtime-plugins/inject-external-runtime-core-plugin/rollup.config.cjs b/packages/runtime-plugins/inject-external-runtime-core-plugin/rollup.config.cjs index b26898d97cc..dfc520c3a92 100644 --- a/packages/runtime-plugins/inject-external-runtime-core-plugin/rollup.config.cjs +++ b/packages/runtime-plugins/inject-external-runtime-core-plugin/rollup.config.cjs @@ -33,6 +33,7 @@ module.exports = (rollupConfig, _projectOptions) => { c.format === 'cjs' ? c.chunkFileNames.replace('.js', '.cjs') : c.chunkFileNames, + ...(c.format === 'cjs' ? { externalLiveBindings: false } : {}), })); } else { rollupConfig.output = { @@ -51,6 +52,9 @@ module.exports = (rollupConfig, _projectOptions) => { rollupConfig.output.format === 'cjs' ? rollupConfig.output.chunkFileNames.replace('.js', '.cjs') : rollupConfig.output.chunkFileNames, + ...(rollupConfig.output.format === 'cjs' + ? { externalLiveBindings: false } + : {}), }; } diff --git a/packages/runtime-tools/rollup.config.cjs b/packages/runtime-tools/rollup.config.cjs index b621b0b1e3a..68d273a1bb9 100644 --- a/packages/runtime-tools/rollup.config.cjs +++ b/packages/runtime-tools/rollup.config.cjs @@ -1,4 +1,4 @@ -module.exports = (rollupConfig) => { +module.exports = function (rollupConfig) { rollupConfig.input = { index: 'packages/runtime-tools/src/index.ts', runtime: 'packages/runtime-tools/src/runtime.ts', @@ -7,23 +7,28 @@ module.exports = (rollupConfig) => { 'runtime-core': 'packages/runtime-tools/src/runtime-core.ts', }; - // Check if output is an array and add hoistTransitiveImports: false if (Array.isArray(rollupConfig.output)) { - rollupConfig.output = rollupConfig.output.map((c) => ({ - ...c, - hoistTransitiveImports: false, - entryFileNames: - c.format === 'cjs' - ? c.entryFileNames.replace('.js', '.cjs') - : c.entryFileNames, - chunkFileNames: - c.format === 'cjs' - ? c.chunkFileNames.replace('.js', '.cjs') - : c.chunkFileNames, - })); + rollupConfig.output = rollupConfig.output.map(function (c) { + var outputConfig = Object.assign({}, c, { + hoistTransitiveImports: false, + entryFileNames: + c.format === 'cjs' + ? c.entryFileNames.replace('.js', '.cjs') + : c.entryFileNames, + chunkFileNames: + c.format === 'cjs' + ? c.chunkFileNames.replace('.js', '.cjs') + : c.chunkFileNames, + }); + + if (c.format === 'cjs') { + outputConfig.externalLiveBindings = false; + } + + return outputConfig; + }); } else { - rollupConfig.output = { - ...rollupConfig.output, + var outputConfig = Object.assign({}, rollupConfig.output, { hoistTransitiveImports: false, entryFileNames: rollupConfig.output.format === 'cjs' @@ -33,7 +38,12 @@ module.exports = (rollupConfig) => { rollupConfig.output.format === 'cjs' ? rollupConfig.output.chunkFileNames.replace('.js', '.cjs') : rollupConfig.output.chunkFileNames, - }; + }); + + if (rollupConfig.output.format === 'cjs') { + outputConfig.externalLiveBindings = false; + } + rollupConfig.output = outputConfig; } return rollupConfig; From 58fce2e4e9144b7908212c3f7b992bf78611cb54 Mon Sep 17 00:00:00 2001 From: ScriptedAlchemy Date: Tue, 15 Apr 2025 20:22:29 -0700 Subject: [PATCH 2/3] chore: improve meta titles of pages --- .../docs/en/guide/basic/type-prompt.mdx | 2 +- .../docs/en/guide/basic/webpack.mdx | 2 +- .../guide/troubleshooting/build/BUILD-001.mdx | 5 +++ .../docs/en/guide/troubleshooting/other.mdx | 7 +++- .../docs/en/guide/troubleshooting/overview.md | 5 +++ .../troubleshooting/runtime/RUNTIME-001.mdx | 5 +++ .../troubleshooting/runtime/RUNTIME-002.mdx | 5 +++ .../troubleshooting/runtime/RUNTIME-003.mdx | 5 +++ .../troubleshooting/runtime/RUNTIME-004.mdx | 5 +++ .../troubleshooting/runtime/RUNTIME-005.mdx | 5 +++ .../troubleshooting/runtime/RUNTIME-006.mdx | 5 +++ .../troubleshooting/runtime/RUNTIME-007.mdx | 5 +++ .../troubleshooting/runtime/RUNTIME-008.mdx | 7 +++- .../guide/troubleshooting/type/TYPE-001.mdx | 5 +++ .../en/guide/troubleshooting/type/overview.md | 5 +++ apps/website-new/docs/en/plugin/dev/index.mdx | 5 +++ .../docs/en/plugin/plugins/index.mdx | 5 +++ .../docs/en/plugin/plugins/retry-plugin.mdx | 5 +++ .../docs/en/practice/bridge/index.mdx | 5 +++ .../docs/en/practice/bridge/react-bridge.mdx | 33 +++++++++++-------- .../docs/en/practice/bridge/vue-bridge.mdx | 5 +++ .../frameworks/next/dynamic-remotes.mdx | 5 +++ .../en/practice/frameworks/next/express.mdx | 5 +++ .../frameworks/next/importing-components.mdx | 5 +++ .../frameworks/next/importing-pages.mdx | 5 +++ .../en/practice/frameworks/next/index.mdx | 3 +- .../en/practice/frameworks/next/presets.mdx | 5 +++ .../practice/frameworks/react/i18n-react.mdx | 3 +- .../en/practice/frameworks/react/index.mdx | 3 +- .../frameworks/react/using-nx-for-react.mdx | 5 +++ 30 files changed, 149 insertions(+), 21 deletions(-) diff --git a/apps/website-new/docs/en/guide/basic/type-prompt.mdx b/apps/website-new/docs/en/guide/basic/type-prompt.mdx index 0145b4ac24f..8f8a42f5f40 100644 --- a/apps/website-new/docs/en/guide/basic/type-prompt.mdx +++ b/apps/website-new/docs/en/guide/basic/type-prompt.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Type Hints | TypeScript Integration Guide +title: Module Federation Remote Type Hints | TypeScript Integration Guide description: Learn how to use Module Federation's type hinting system for improved TypeScript support and development experience. --- diff --git a/apps/website-new/docs/en/guide/basic/webpack.mdx b/apps/website-new/docs/en/guide/basic/webpack.mdx index ee60f52edf4..c16d7ef9f3c 100644 --- a/apps/website-new/docs/en/guide/basic/webpack.mdx +++ b/apps/website-new/docs/en/guide/basic/webpack.mdx @@ -1,5 +1,5 @@ --- -title: Webpack Plugin +title: Module Federation Webpack Plugin | Build System Integration description: Configuring and using the Module Federation plugin within Webpack build environments. --- diff --git a/apps/website-new/docs/en/guide/troubleshooting/build/BUILD-001.mdx b/apps/website-new/docs/en/guide/troubleshooting/build/BUILD-001.mdx index 7023a611215..a582ab1d4b0 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/build/BUILD-001.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/build/BUILD-001.mdx @@ -1,3 +1,8 @@ +--- +title: BUILD-001 | Expose Module Not Found +description: Troubleshooting guide for the BUILD-001 error, which occurs when the exposed module resources cannot be found properly during the build process. +--- + import ErrorCodeTitle from '@components/ErrorCodeTitle'; diff --git a/apps/website-new/docs/en/guide/troubleshooting/other.mdx b/apps/website-new/docs/en/guide/troubleshooting/other.mdx index d457f55be79..3c487de9fa5 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/other.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/other.mdx @@ -1,3 +1,8 @@ +--- +title: Common Issues | Module Federation Troubleshooting +description: Solutions for common Module Federation implementation issues, including React hook errors, dependency conflicts, and other frequently encountered problems. +--- + # Other This section is a collection of common issues related to the implementation of `Module Federation` in general(not specific error code). @@ -89,4 +94,4 @@ When `exposes` is set in the project, it will be regarded as a producer. To ensu * [Modern.js]: Set [devServer.headers](https://modernjs.dev/configure/app/tools/dev-server.html#headers) value to the specified domain whitelist instead of `*` -* [Rsbuild]: Set [server.cors.origin](https://rsbuild.dev/config/server/cors#origin) value to the specified domain whitelist instead of `*` \ No newline at end of file +* [Rsbuild]: Set [server.cors.origin](https://rsbuild.dev/config/server/cors#origin) value to the specified domain whitelist instead of `*` diff --git a/apps/website-new/docs/en/guide/troubleshooting/overview.md b/apps/website-new/docs/en/guide/troubleshooting/overview.md index 54d901cf75b..6c2804bf3e7 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/overview.md +++ b/apps/website-new/docs/en/guide/troubleshooting/overview.md @@ -1,3 +1,8 @@ +--- +title: Troubleshooting Overview | Module Federation Error Guide +description: Comprehensive guide to troubleshooting Module Federation issues, including error codes, common problems, and solutions. +--- + # Overview Module Federation currently provides **Build Tools**, **Runtime API**, **Type Hints** and **Debugging Tools**. In order to locate the corresponding problems faster, we classify error messages. Divide them into the following categories: diff --git a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-001.mdx b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-001.mdx index f348fc57ede..dbaaf6f3872 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-001.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-001.mdx @@ -1,3 +1,8 @@ +--- +title: RUNTIME-001 | Remote Entry Not Found +description: Troubleshooting guide for the RUNTIME-001 error, which occurs when the producer entry file cannot be found or loaded properly. +--- + import ErrorCodeTitle from '@components/ErrorCodeTitle'; import Table from '@components/Table' diff --git a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-002.mdx b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-002.mdx index cfa62a96d9e..60ef97d7e4a 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-002.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-002.mdx @@ -1,3 +1,8 @@ +--- +title: RUNTIME-002 | Cannot Get Init Function +description: Troubleshooting guide for the RUNTIME-002 error, where the 'init' function is missing from the remote container. +--- + import ErrorCodeTitle from '@components/ErrorCodeTitle'; import Table from '@components/Table' diff --git a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-003.mdx b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-003.mdx index 79a7e458b8c..44ff7e19a40 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-003.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-003.mdx @@ -1,3 +1,8 @@ +--- +title: RUNTIME-003 | Manifest Load Failed +description: Troubleshooting guide for the RUNTIME-003 error, occurring when the manifest file fails to load, possibly due to an incorrect URL or CORS issues. +--- + import ErrorCodeTitle from '@components/ErrorCodeTitle'; diff --git a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-004.mdx b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-004.mdx index fe74b0eee93..4a007a5f0b8 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-004.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-004.mdx @@ -1,3 +1,8 @@ +--- +title: RUNTIME-004 | Remote Module Not Found +description: Troubleshooting guide for the RUNTIME-004 error, when a matching remote module cannot be located, possibly due to registration issues, incorrect alias/name, or a 'beforeRequest' hook. +--- + import ErrorCodeTitle from '@components/ErrorCodeTitle'; diff --git a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-005.mdx b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-005.mdx index 3d3a485743b..a1500b592d8 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-005.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-005.mdx @@ -1,3 +1,8 @@ +--- +title: "RUNTIME-005 | Shared Module Not Ready for Eager Use" +description: "Troubleshooting guide for the RUNTIME-005 error, occurring when a shared module is configured as async but is attempted to be consumed eagerly without eager: true" +--- + import ErrorCodeTitle from '@components/ErrorCodeTitle'; diff --git a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-006.mdx b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-006.mdx index ef162504f2d..15473afd367 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-006.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-006.mdx @@ -1,3 +1,8 @@ +--- +title: RUNTIME-006 | Invalid Sync Share Usage +description: Troubleshooting guide for the RUNTIME-006 error, caused by using 'loadShareSync' for a shared dependency that has not yet been loaded. +--- + import ErrorCodeTitle from '@components/ErrorCodeTitle'; diff --git a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-007.mdx b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-007.mdx index b1d2d8c13a0..d97a679993d 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-007.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-007.mdx @@ -1,3 +1,8 @@ +--- +title: RUNTIME-007 | Missing Snapshot Data for Versioned Remote +description: Troubleshooting guide for the RUNTIME-007 error, occurring when the remote entry uses a version number but the corresponding snapshot data is missing. +--- + import ErrorCodeTitle from '@components/ErrorCodeTitle'; diff --git a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-008.mdx b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-008.mdx index a96cb6d655b..78cc9e711df 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-008.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/runtime/RUNTIME-008.mdx @@ -1,3 +1,8 @@ +--- +title: RUNTIME-008 | Resource Load Failed +description: Troubleshooting guide for the RUNTIME-008 error, occurring when a resource fails to load during runtime, possibly due to network issues or incorrect address. +--- + import ErrorCodeTitle from '@components/ErrorCodeTitle'; @@ -9,4 +14,4 @@ Failed to load resource during the runtime process, which may be caused by netwo ## Solutions -check whether the resource address is correct. If the resource address is correct, check whether the network is stable. If the network is unstable, you can add the retry mechanism, refer to [Runtime Retry Mechanism](en/plugin/plugins/retry-plugin.html). \ No newline at end of file +check whether the resource address is correct. If the resource address is correct, check whether the network is stable. If the network is unstable, you can add the retry mechanism, refer to [Runtime Retry Mechanism](en/plugin/plugins/retry-plugin.html). diff --git a/apps/website-new/docs/en/guide/troubleshooting/type/TYPE-001.mdx b/apps/website-new/docs/en/guide/troubleshooting/type/TYPE-001.mdx index 7b3014442bc..fd8941e06c9 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/type/TYPE-001.mdx +++ b/apps/website-new/docs/en/guide/troubleshooting/type/TYPE-001.mdx @@ -1,3 +1,8 @@ +--- +title: TYPE-001 | Type Generation Failed +description: Troubleshooting guide for the TYPE-001 error, which occurs when TypeScript type generation fails due to missing or incorrect tsconfig.json properties. +--- + import ErrorCodeTitle from '@components/ErrorCodeTitle'; diff --git a/apps/website-new/docs/en/guide/troubleshooting/type/overview.md b/apps/website-new/docs/en/guide/troubleshooting/type/overview.md index fdfd3043b96..d8491a4b657 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/type/overview.md +++ b/apps/website-new/docs/en/guide/troubleshooting/type/overview.md @@ -1,3 +1,8 @@ +--- +title: Type Errors Overview | Module Federation Troubleshooting +description: Overview of Module Federation type errors, covering fixed error codes and scenario-specific issues like type aliases. +--- + # Overview Type errors are divided into two types: fixed error code errors and scenario-related errors. diff --git a/apps/website-new/docs/en/plugin/dev/index.mdx b/apps/website-new/docs/en/plugin/dev/index.mdx index e05846a7aa6..3bbb78b0bea 100644 --- a/apps/website-new/docs/en/plugin/dev/index.mdx +++ b/apps/website-new/docs/en/plugin/dev/index.mdx @@ -1,3 +1,8 @@ +--- +title: Plugin Development | Module Federation Runtime Extension +description: Comprehensive guide to developing custom runtime plugins for Module Federation, including hooks, structure, and registration methods. +--- + # Plugin System Module Federation provides a lightweight runtime plugin system for implementing most of its features and allowing users to extend functionalities. diff --git a/apps/website-new/docs/en/plugin/plugins/index.mdx b/apps/website-new/docs/en/plugin/plugins/index.mdx index 77904b74bb8..57938c0fc5c 100644 --- a/apps/website-new/docs/en/plugin/plugins/index.mdx +++ b/apps/website-new/docs/en/plugin/plugins/index.mdx @@ -1,3 +1,8 @@ +--- +title: Node Plugin | Server-Side Module Federation +description: Guide to using the Module Federation Node Plugin for server-side rendering (SSR) and backend micro-frontend architectures. +--- + import { PackageManagerTabs, Tabs, Tab } from '@theme'; # Node Plugin diff --git a/apps/website-new/docs/en/plugin/plugins/retry-plugin.mdx b/apps/website-new/docs/en/plugin/plugins/retry-plugin.mdx index 9e03a9af0a8..2116bc14a9e 100644 --- a/apps/website-new/docs/en/plugin/plugins/retry-plugin.mdx +++ b/apps/website-new/docs/en/plugin/plugins/retry-plugin.mdx @@ -1,3 +1,8 @@ +--- +title: Retry Plugin | Resource Loading Resilience +description: Learn how to use the Module Federation Retry Plugin to automatically retry failed resource loads (fetch/script) and improve application stability. +--- + import { PackageManagerTabs, Tabs, Tab } from '@theme'; # Resource Retry Plugin diff --git a/apps/website-new/docs/en/practice/bridge/index.mdx b/apps/website-new/docs/en/practice/bridge/index.mdx index 47fa3fff47a..1e716b930ca 100644 --- a/apps/website-new/docs/en/practice/bridge/index.mdx +++ b/apps/website-new/docs/en/practice/bridge/index.mdx @@ -1,3 +1,8 @@ +--- +title: Framework Bridge Overview | Module Federation Practice +description: Introduction to the Module Federation Bridge utility for loading application-level modules across different frameworks (React, Vue) and managing inter-app routing. +--- + # Bridge Overview ## Introduction diff --git a/apps/website-new/docs/en/practice/bridge/react-bridge.mdx b/apps/website-new/docs/en/practice/bridge/react-bridge.mdx index f39eaa2c8c8..7d88431d550 100644 --- a/apps/website-new/docs/en/practice/bridge/react-bridge.mdx +++ b/apps/website-new/docs/en/practice/bridge/react-bridge.mdx @@ -1,3 +1,8 @@ +--- +title: React Bridge | Module Federation Practice +description: Guide to using @module-federation/bridge-react for exporting and consuming React application-level modules within a Module Federation architecture. +--- + # React Bridge `@module-federation/bridge-react` provides bridge utility functions for React applications: @@ -198,8 +203,8 @@ function createBridgeComponent( interface ProviderFnParams { /** Root component to be remotely loaded */ rootComponent: React.ComponentType; - - /** + + /** * Custom render function for custom rendering logic * @param App - React element * @param id - DOM element or string ID @@ -209,7 +214,7 @@ interface ProviderFnParams { App: React.ReactElement, id?: HTMLElement | string, ) => RootType | Promise; - + /** * Custom function to create React root node * @param container - Container element @@ -228,10 +233,10 @@ interface ProviderFnParams { interface CreateRootOptions { /** Add prefix to generated React IDs to avoid ID conflicts */ identifierPrefix?: string; - + /** Callback function to handle recoverable errors during React rendering */ onRecoverableError?: (error: unknown) => void; - + /** Transition callbacks for React 18 concurrent features */ transitionCallbacks?: TransitionCallbacks; } @@ -260,19 +265,19 @@ interface RemoteComponentParams< T = Record, E extends keyof T = keyof T > { - /** + /** * Function to load remote module * Example: () => loadRemote('remote1/export-app') or () => import('remote1/export-app') */ loader: () => Promise; - + /** Component displayed when loading remote module */ loading: React.ReactNode; - + /** Error component displayed when loading or rendering remote module fails */ fallback: React.ComponentType<{ error: Error }>; - - /** + + /** * Specify module export name * Default is 'default' */ @@ -286,18 +291,18 @@ interface RemoteComponentProps> { /** Properties passed to remote component */ props?: T; - /** + /** * Memory route configuration, used to control child application routing as memoryRouter * Will not directly display URL in browser address bar */ memoryRoute?: { entryPath: string }; - + /** Base path name */ basename?: string; - + /** Style */ style?: React.CSSProperties; - + /** Class name */ className?: string; } diff --git a/apps/website-new/docs/en/practice/bridge/vue-bridge.mdx b/apps/website-new/docs/en/practice/bridge/vue-bridge.mdx index 92a92f4c39b..b661b90a717 100644 --- a/apps/website-new/docs/en/practice/bridge/vue-bridge.mdx +++ b/apps/website-new/docs/en/practice/bridge/vue-bridge.mdx @@ -1,3 +1,8 @@ +--- +title: Vue Bridge (Vue 3) | Module Federation Practice +description: Guide to using @module-federation/bridge-vue3 for exporting and consuming Vue 3 application-level modules within a Module Federation architecture. +--- + # Vue Bridge (for Vue v3) `@module-federation/bridge-vue3` provides a `bridge` utility function for Vue V3 applications. The provided `createBridgeComponent` can be used to export application-level modules, and `createRemoteComponent` can be used to load application-level modules. diff --git a/apps/website-new/docs/en/practice/frameworks/next/dynamic-remotes.mdx b/apps/website-new/docs/en/practice/frameworks/next/dynamic-remotes.mdx index db11cc17c8d..808caa0ec15 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/dynamic-remotes.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/dynamic-remotes.mdx @@ -1,3 +1,8 @@ +--- +title: Dynamic Remotes | Next.js Federation +description: Guide to implementing dynamic remote loading in Next.js Module Federation, including runtime initialization and custom remote configuration. +--- + # Dynamic Remotes ```js diff --git a/apps/website-new/docs/en/practice/frameworks/next/express.mdx b/apps/website-new/docs/en/practice/frameworks/next/express.mdx index 293585394a7..786773b0bcf 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/express.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/express.mdx @@ -1,3 +1,8 @@ +--- +title: Express Integration | Next.js Federation +description: Guide to using Express.js with Next.js Module Federation, including hot module reloading setup and route cache management. +--- + import {Steps} from '@theme' # Working with Express.js diff --git a/apps/website-new/docs/en/practice/frameworks/next/importing-components.mdx b/apps/website-new/docs/en/practice/frameworks/next/importing-components.mdx index a3d4b714567..ab3af224c41 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/importing-components.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/importing-components.mdx @@ -1,3 +1,8 @@ +--- +title: Component Importing | Next.js Federation +description: Learn different methods for importing federated components in Next.js, including lazy loading, eager imports, and client-side only components. +--- + # Importing Components Remote Modules can be imported in various ways. diff --git a/apps/website-new/docs/en/practice/frameworks/next/importing-pages.mdx b/apps/website-new/docs/en/practice/frameworks/next/importing-pages.mdx index 0d4f01dedf6..35a10808863 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/importing-pages.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/importing-pages.mdx @@ -1,3 +1,8 @@ +--- +title: Page Importing | Next.js Federation +description: Guide to importing and routing federated pages in Next.js, including handling data fetching methods and page lifecycle management. +--- + import {Tabs, Tab} from '@theme' # Routing & Importing Pages diff --git a/apps/website-new/docs/en/practice/frameworks/next/index.mdx b/apps/website-new/docs/en/practice/frameworks/next/index.mdx index 3702d398bf5..e4431dc537e 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/index.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/index.mdx @@ -1,5 +1,6 @@ --- -title: "Basic Example" +title: Next.js Integration | Module Federation Practice +description: Guide to integrating Module Federation with Next.js, including SSR setup, environment configuration, and project initialization for Pages Router. --- # Next.js & Module Federation diff --git a/apps/website-new/docs/en/practice/frameworks/next/presets.mdx b/apps/website-new/docs/en/practice/frameworks/next/presets.mdx index 8ea6e5c3917..a407af0244f 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/presets.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/presets.mdx @@ -1,3 +1,8 @@ +--- +title: Preset Configuration | Next.js Federation +description: Overview of Next.js Module Federation presets, including shared dependencies, page exposure configuration, and build options. +--- + # Presets ## Shared diff --git a/apps/website-new/docs/en/practice/frameworks/react/i18n-react.mdx b/apps/website-new/docs/en/practice/frameworks/react/i18n-react.mdx index 46484b9d2ba..6bccaf58759 100644 --- a/apps/website-new/docs/en/practice/frameworks/react/i18n-react.mdx +++ b/apps/website-new/docs/en/practice/frameworks/react/i18n-react.mdx @@ -1,5 +1,6 @@ --- -title: "Internationalization (i18n)" +title: React i18n Integration | Module Federation Practice +description: Guide to implementing internationalization (i18n) in React micro-frontends using Module Federation, including language synchronization and state management. --- # Implementing Internationalization (i18n) with Module Federation in React Micro-Frontends diff --git a/apps/website-new/docs/en/practice/frameworks/react/index.mdx b/apps/website-new/docs/en/practice/frameworks/react/index.mdx index bcd297f926e..5fffd7864db 100644 --- a/apps/website-new/docs/en/practice/frameworks/react/index.mdx +++ b/apps/website-new/docs/en/practice/frameworks/react/index.mdx @@ -1,5 +1,6 @@ --- -title: "Basic CRA with Rsbuild" +title: React with Rsbuild | Module Federation Practice +description: Step-by-step guide to setting up a React application with Rsbuild and Module Federation, including environment setup and component sharing. --- # Basic CRA with Rsbuild diff --git a/apps/website-new/docs/en/practice/frameworks/react/using-nx-for-react.mdx b/apps/website-new/docs/en/practice/frameworks/react/using-nx-for-react.mdx index dfbb367c0cc..344347f9e20 100644 --- a/apps/website-new/docs/en/practice/frameworks/react/using-nx-for-react.mdx +++ b/apps/website-new/docs/en/practice/frameworks/react/using-nx-for-react.mdx @@ -1,3 +1,8 @@ +--- +title: Nx CLI Integration | Module Federation Practice +description: Comprehensive guide to using Nx CLI for React projects with Module Federation, including host and remote application setup, development workflow, and build processes. +--- + import { Steps, Badge } from '@theme'; # Using Nx CLI for React From bb94b90de9dcef5e7e72ee7850f202116949b6d4 Mon Sep 17 00:00:00 2001 From: ScriptedAlchemy Date: Tue, 15 Apr 2025 23:06:56 -0700 Subject: [PATCH 3/3] chore: update meta titles and structure for documentation files --- apps/website-new/docs/en/guide/_meta.json | 8 ++-- .../docs/en/guide/basic/_meta.json | 43 ++++++++++++++++++- .../docs/en/guide/basic/chrome-devtool.mdx | 2 +- apps/website-new/docs/en/guide/basic/cli.mdx | 4 +- .../docs/en/guide/basic/rsbuild.mdx | 2 +- .../docs/en/guide/basic/rspack.mdx | 2 +- .../docs/en/guide/basic/runtime.mdx | 2 +- .../docs/en/guide/basic/type-prompt.mdx | 2 +- apps/website-new/docs/en/guide/basic/vite.mdx | 2 +- .../docs/en/guide/basic/webpack.mdx | 2 +- .../docs/en/guide/framework/modernjs.mdx | 2 +- .../docs/en/guide/framework/nextjs.mdx | 2 +- .../docs/en/guide/start/features.mdx | 2 +- .../docs/en/guide/start/glossary.mdx | 2 +- .../website-new/docs/en/guide/start/index.mdx | 2 +- .../docs/en/guide/start/npm-packages.mdx | 2 +- .../docs/en/guide/start/quick-start.mdx | 2 +- .../docs/en/guide/start/setting-up-env.mdx | 2 +- .../docs/en/guide/troubleshooting/_meta.json | 18 +++++--- .../en/guide/troubleshooting/build/_meta.json | 7 +++ .../guide/troubleshooting/runtime/_meta.json | 42 ++++++++++++++++++ .../en/guide/troubleshooting/type/_meta.json | 4 -- .../website-new/docs/en/plugin/dev/_meta.json | 8 +++- .../docs/en/plugin/plugins/_meta.json | 13 +++++- .../docs/en/practice/bridge/index.mdx | 2 +- .../docs/en/practice/bridge/react-bridge.mdx | 2 +- .../docs/en/practice/bridge/vue-bridge.mdx | 2 +- .../en/practice/frameworks/modern/_meta.json | 13 +++++- .../en/practice/frameworks/next/_meta.json | 28 +++++++++++- .../frameworks/next/dynamic-remotes.mdx | 2 +- .../en/practice/frameworks/next/express.mdx | 2 +- .../frameworks/next/importing-components.mdx | 2 +- .../frameworks/next/importing-pages.mdx | 2 +- .../en/practice/frameworks/next/index.mdx | 2 +- .../en/practice/frameworks/next/presets.mdx | 2 +- .../en/practice/frameworks/react/_meta.json | 18 +++++++- .../practice/frameworks/react/i18n-react.mdx | 2 +- .../en/practice/frameworks/react/index.mdx | 2 +- .../frameworks/react/using-nx-for-react.mdx | 2 +- 39 files changed, 213 insertions(+), 47 deletions(-) create mode 100644 apps/website-new/docs/en/guide/troubleshooting/build/_meta.json create mode 100644 apps/website-new/docs/en/guide/troubleshooting/runtime/_meta.json delete mode 100644 apps/website-new/docs/en/guide/troubleshooting/type/_meta.json diff --git a/apps/website-new/docs/en/guide/_meta.json b/apps/website-new/docs/en/guide/_meta.json index 4a5d4f2f583..993fa2aa852 100644 --- a/apps/website-new/docs/en/guide/_meta.json +++ b/apps/website-new/docs/en/guide/_meta.json @@ -7,7 +7,7 @@ { "type": "dir", "name": "basic", - "label": "basic" + "label": "Basic" }, { "type": "dir", @@ -15,8 +15,8 @@ "label": "Frameworks" }, { - "type":"dir", - "name":"troubleshooting", - "label":"Troubleshooting" + "type": "dir", + "name": "troubleshooting", + "label": "Troubleshooting" } ] diff --git a/apps/website-new/docs/en/guide/basic/_meta.json b/apps/website-new/docs/en/guide/basic/_meta.json index 70b2cb33df2..68d019fbf5a 100644 --- a/apps/website-new/docs/en/guide/basic/_meta.json +++ b/apps/website-new/docs/en/guide/basic/_meta.json @@ -1 +1,42 @@ -["runtime", "rsbuild", "rspack", "webpack", "vite", "chrome-devtool", "type-prompt","cli"] +[ + { + "type": "file", + "name": "runtime", + "label": "Runtime" + }, + { + "type": "file", + "name": "rsbuild", + "label": "Rsbuild Plugin" + }, + { + "type": "file", + "name": "rspack", + "label": "Rspack Plugin" + }, + { + "type": "file", + "name": "webpack", + "label": "Webpack Plugin" + }, + { + "type": "file", + "name": "vite", + "label": "Vite Plugin" + }, + { + "type": "file", + "name": "chrome-devtool", + "label": "Chrome DevTools" + }, + { + "type": "file", + "name": "type-prompt", + "label": "Type Prompt" + }, + { + "type": "file", + "name": "cli", + "label": "CLI" + } +] diff --git a/apps/website-new/docs/en/guide/basic/chrome-devtool.mdx b/apps/website-new/docs/en/guide/basic/chrome-devtool.mdx index 92e6e62291e..ef9ac25379a 100644 --- a/apps/website-new/docs/en/guide/basic/chrome-devtool.mdx +++ b/apps/website-new/docs/en/guide/basic/chrome-devtool.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Chrome DevTools | Debugging and Development Tools +title: Chrome DevTools description: Learn how to use Chrome DevTools with Module Federation for debugging, inspecting dependencies, and monitoring module loading. --- diff --git a/apps/website-new/docs/en/guide/basic/cli.mdx b/apps/website-new/docs/en/guide/basic/cli.mdx index 7d4d49867bb..b723e362425 100644 --- a/apps/website-new/docs/en/guide/basic/cli.mdx +++ b/apps/website-new/docs/en/guide/basic/cli.mdx @@ -1,8 +1,10 @@ --- -title: Module Federation CLI | Command Line Interface Guide +title: CLI description: Comprehensive guide to using the Module Federation CLI for project creation, management, and development workflows. --- +# CLI + `@module-federation/enhanced` and `@module-federation/modern-js` provides a lightweight CLI. ## All commands diff --git a/apps/website-new/docs/en/guide/basic/rsbuild.mdx b/apps/website-new/docs/en/guide/basic/rsbuild.mdx index 7796c9d51b0..86863340146 100644 --- a/apps/website-new/docs/en/guide/basic/rsbuild.mdx +++ b/apps/website-new/docs/en/guide/basic/rsbuild.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Rsbuild Plugin | Build Tool Integration +title: Rsbuild Plugin description: Learn how to integrate Module Federation with Rsbuild, including configuration options and best practices for micro-frontend development. --- diff --git a/apps/website-new/docs/en/guide/basic/rspack.mdx b/apps/website-new/docs/en/guide/basic/rspack.mdx index 9ff5cd93faf..784bf26ee40 100644 --- a/apps/website-new/docs/en/guide/basic/rspack.mdx +++ b/apps/website-new/docs/en/guide/basic/rspack.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Rspack Plugin | High-Performance Build Integration +title: Rspack Plugin description: Guide to using Module Federation with Rspack, leveraging its high-performance build capabilities for micro-frontend applications. --- diff --git a/apps/website-new/docs/en/guide/basic/runtime.mdx b/apps/website-new/docs/en/guide/basic/runtime.mdx index cdf2bf069b3..6686c23f702 100644 --- a/apps/website-new/docs/en/guide/basic/runtime.mdx +++ b/apps/website-new/docs/en/guide/basic/runtime.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Runtime | Core Runtime System +title: Runtime description: Comprehensive guide to the Module Federation runtime system, including module loading, sharing, and runtime plugin capabilities. --- diff --git a/apps/website-new/docs/en/guide/basic/type-prompt.mdx b/apps/website-new/docs/en/guide/basic/type-prompt.mdx index 8f8a42f5f40..037475af27b 100644 --- a/apps/website-new/docs/en/guide/basic/type-prompt.mdx +++ b/apps/website-new/docs/en/guide/basic/type-prompt.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Remote Type Hints | TypeScript Integration Guide +title: Remote Type Hints description: Learn how to use Module Federation's type hinting system for improved TypeScript support and development experience. --- diff --git a/apps/website-new/docs/en/guide/basic/vite.mdx b/apps/website-new/docs/en/guide/basic/vite.mdx index e8753055767..c0b99e62672 100644 --- a/apps/website-new/docs/en/guide/basic/vite.mdx +++ b/apps/website-new/docs/en/guide/basic/vite.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Vite Plugin | Fast Development Integration +title: Vite Plugin description: Guide to integrating Module Federation with Vite for fast development and optimized builds in micro-frontend applications. --- diff --git a/apps/website-new/docs/en/guide/basic/webpack.mdx b/apps/website-new/docs/en/guide/basic/webpack.mdx index c16d7ef9f3c..ee60f52edf4 100644 --- a/apps/website-new/docs/en/guide/basic/webpack.mdx +++ b/apps/website-new/docs/en/guide/basic/webpack.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Webpack Plugin | Build System Integration +title: Webpack Plugin description: Configuring and using the Module Federation plugin within Webpack build environments. --- diff --git a/apps/website-new/docs/en/guide/framework/modernjs.mdx b/apps/website-new/docs/en/guide/framework/modernjs.mdx index e1ade0b535c..bb33b2b9920 100644 --- a/apps/website-new/docs/en/guide/framework/modernjs.mdx +++ b/apps/website-new/docs/en/guide/framework/modernjs.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Modern.js Plugin | Framework Integration Guide +title: Modern.js Plugin description: Learn how to integrate Module Federation with Modern.js for building scalable micro-frontend applications. --- diff --git a/apps/website-new/docs/en/guide/framework/nextjs.mdx b/apps/website-new/docs/en/guide/framework/nextjs.mdx index 52d9f524b14..7807163e829 100644 --- a/apps/website-new/docs/en/guide/framework/nextjs.mdx +++ b/apps/website-new/docs/en/guide/framework/nextjs.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Next.js Plugin | SSR Framework Integration +title: Next.js Plugin description: Comprehensive guide to using Module Federation with Next.js, including Server-Side Rendering and static site generation support. --- diff --git a/apps/website-new/docs/en/guide/start/features.mdx b/apps/website-new/docs/en/guide/start/features.mdx index d9b791752a5..c5bba6f080c 100644 --- a/apps/website-new/docs/en/guide/start/features.mdx +++ b/apps/website-new/docs/en/guide/start/features.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Features | Comprehensive Feature Guide +title: Features description: Explore the advanced capabilities of Module Federation 2.0, including runtime plugins, manifest support, dynamic type hints, and framework integrations. --- diff --git a/apps/website-new/docs/en/guide/start/glossary.mdx b/apps/website-new/docs/en/guide/start/glossary.mdx index 57fd3505281..b229571a318 100644 --- a/apps/website-new/docs/en/guide/start/glossary.mdx +++ b/apps/website-new/docs/en/guide/start/glossary.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Glossary | Terminology Reference Guide +title: Glossary description: Comprehensive glossary of Module Federation terms and concepts, including producers, consumers, micro-frontends, and bundler definitions. --- diff --git a/apps/website-new/docs/en/guide/start/index.mdx b/apps/website-new/docs/en/guide/start/index.mdx index 2a8411f6747..242ebb550da 100644 --- a/apps/website-new/docs/en/guide/start/index.mdx +++ b/apps/website-new/docs/en/guide/start/index.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation 2.0 | Introduction to Micro-Frontend Architecture +title: Introduction description: Learn about Module Federation 2.0, a powerful architecture pattern for building micro-frontends with enhanced features like runtime plugins, manifest support, and dynamic type hints. --- diff --git a/apps/website-new/docs/en/guide/start/npm-packages.mdx b/apps/website-new/docs/en/guide/start/npm-packages.mdx index 799c1daf1a3..5d4786ef8e9 100644 --- a/apps/website-new/docs/en/guide/start/npm-packages.mdx +++ b/apps/website-new/docs/en/guide/start/npm-packages.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation NPM Packages | Complete Package Ecosystem +title: NPM Packages description: Comprehensive guide to all Module Federation NPM packages, including enhanced core, runtime, Rspack plugin, Next.js integration, and utility packages. --- diff --git a/apps/website-new/docs/en/guide/start/quick-start.mdx b/apps/website-new/docs/en/guide/start/quick-start.mdx index 832757270b6..f4db9559212 100644 --- a/apps/website-new/docs/en/guide/start/quick-start.mdx +++ b/apps/website-new/docs/en/guide/start/quick-start.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Quick Start | Getting Started Guide +title: Quick Start Guide description: Step-by-step guide to setting up your first Module Federation project, including creating providers and consumers with modern build tools. --- diff --git a/apps/website-new/docs/en/guide/start/setting-up-env.mdx b/apps/website-new/docs/en/guide/start/setting-up-env.mdx index 6c43b9cd1fb..7c914861408 100644 --- a/apps/website-new/docs/en/guide/start/setting-up-env.mdx +++ b/apps/website-new/docs/en/guide/start/setting-up-env.mdx @@ -1,5 +1,5 @@ --- -title: Module Federation Environment Setup | Prerequisites Guide +title: Environment Setup description: Complete guide to setting up your development environment for Module Federation, including Node.js requirements and essential web development prerequisites. --- diff --git a/apps/website-new/docs/en/guide/troubleshooting/_meta.json b/apps/website-new/docs/en/guide/troubleshooting/_meta.json index 33f7f1de891..472fc3d0857 100644 --- a/apps/website-new/docs/en/guide/troubleshooting/_meta.json +++ b/apps/website-new/docs/en/guide/troubleshooting/_meta.json @@ -1,22 +1,30 @@ [ - "overview", + { + "type": "file", + "name": "overview", + "label": "Overview" + }, { "type": "dir", "name": "runtime", "label": "Runtime", - "collapsed":true + "collapsed": true }, { "type": "dir", "name": "build", "label": "Build", - "collapsed":true + "collapsed": true }, { "type": "dir", "name": "type", "label": "Type", - "collapsed":true + "collapsed": true }, - "other" + { + "type": "file", + "name": "other", + "label": "Other" + } ] diff --git a/apps/website-new/docs/en/guide/troubleshooting/build/_meta.json b/apps/website-new/docs/en/guide/troubleshooting/build/_meta.json new file mode 100644 index 00000000000..4e803e8d10c --- /dev/null +++ b/apps/website-new/docs/en/guide/troubleshooting/build/_meta.json @@ -0,0 +1,7 @@ +[ + { + "type": "file", + "name": "BUILD-001", + "label": "BUILD-001" + } +] diff --git a/apps/website-new/docs/en/guide/troubleshooting/runtime/_meta.json b/apps/website-new/docs/en/guide/troubleshooting/runtime/_meta.json new file mode 100644 index 00000000000..f4b5b2952b4 --- /dev/null +++ b/apps/website-new/docs/en/guide/troubleshooting/runtime/_meta.json @@ -0,0 +1,42 @@ +[ + { + "type": "file", + "name": "RUNTIME-001", + "label": "RUNTIME-001" + }, + { + "type": "file", + "name": "RUNTIME-002", + "label": "RUNTIME-002" + }, + { + "type": "file", + "name": "RUNTIME-003", + "label": "RUNTIME-003" + }, + { + "type": "file", + "name": "RUNTIME-004", + "label": "RUNTIME-004" + }, + { + "type": "file", + "name": "RUNTIME-005", + "label": "RUNTIME-005" + }, + { + "type": "file", + "name": "RUNTIME-006", + "label": "RUNTIME-006" + }, + { + "type": "file", + "name": "RUNTIME-007", + "label": "RUNTIME-007" + }, + { + "type": "file", + "name": "RUNTIME-008", + "label": "RUNTIME-008" + } +] diff --git a/apps/website-new/docs/en/guide/troubleshooting/type/_meta.json b/apps/website-new/docs/en/guide/troubleshooting/type/_meta.json deleted file mode 100644 index d8fe1767352..00000000000 --- a/apps/website-new/docs/en/guide/troubleshooting/type/_meta.json +++ /dev/null @@ -1,4 +0,0 @@ -[ - "overview", - "TYPE-001" -] diff --git a/apps/website-new/docs/en/plugin/dev/_meta.json b/apps/website-new/docs/en/plugin/dev/_meta.json index a7d5eda49cb..5dcb951a09d 100644 --- a/apps/website-new/docs/en/plugin/dev/_meta.json +++ b/apps/website-new/docs/en/plugin/dev/_meta.json @@ -1 +1,7 @@ -["index"] +[ + { + "type": "file", + "name": "index", + "label": "Plugin System" + } +] diff --git a/apps/website-new/docs/en/plugin/plugins/_meta.json b/apps/website-new/docs/en/plugin/plugins/_meta.json index 4e00247085d..6553fb7d2d8 100644 --- a/apps/website-new/docs/en/plugin/plugins/_meta.json +++ b/apps/website-new/docs/en/plugin/plugins/_meta.json @@ -1 +1,12 @@ -["index", "retry-plugin"] +[ + { + "type": "file", + "name": "index", + "label": "Node Plugin" + }, + { + "type": "file", + "name": "retry-plugin", + "label": "Resource Retry Plugin" + } +] diff --git a/apps/website-new/docs/en/practice/bridge/index.mdx b/apps/website-new/docs/en/practice/bridge/index.mdx index 1e716b930ca..a8815f0d80d 100644 --- a/apps/website-new/docs/en/practice/bridge/index.mdx +++ b/apps/website-new/docs/en/practice/bridge/index.mdx @@ -1,5 +1,5 @@ --- -title: Framework Bridge Overview | Module Federation Practice +title: Bridge Overview description: Introduction to the Module Federation Bridge utility for loading application-level modules across different frameworks (React, Vue) and managing inter-app routing. --- diff --git a/apps/website-new/docs/en/practice/bridge/react-bridge.mdx b/apps/website-new/docs/en/practice/bridge/react-bridge.mdx index 7d88431d550..f2e216ce70b 100644 --- a/apps/website-new/docs/en/practice/bridge/react-bridge.mdx +++ b/apps/website-new/docs/en/practice/bridge/react-bridge.mdx @@ -1,5 +1,5 @@ --- -title: React Bridge | Module Federation Practice +title: React Bridge description: Guide to using @module-federation/bridge-react for exporting and consuming React application-level modules within a Module Federation architecture. --- diff --git a/apps/website-new/docs/en/practice/bridge/vue-bridge.mdx b/apps/website-new/docs/en/practice/bridge/vue-bridge.mdx index b661b90a717..48784856646 100644 --- a/apps/website-new/docs/en/practice/bridge/vue-bridge.mdx +++ b/apps/website-new/docs/en/practice/bridge/vue-bridge.mdx @@ -1,5 +1,5 @@ --- -title: Vue Bridge (Vue 3) | Module Federation Practice +title: Vue Bridge (Vue 3) description: Guide to using @module-federation/bridge-vue3 for exporting and consuming Vue 3 application-level modules within a Module Federation architecture. --- diff --git a/apps/website-new/docs/en/practice/frameworks/modern/_meta.json b/apps/website-new/docs/en/practice/frameworks/modern/_meta.json index 1b38edd64ba..30900d22f1a 100644 --- a/apps/website-new/docs/en/practice/frameworks/modern/_meta.json +++ b/apps/website-new/docs/en/practice/frameworks/modern/_meta.json @@ -1 +1,12 @@ -["index","dynamic-remote"] +[ + { + "type": "file", + "name": "index", + "label": "Quick Start" + }, + { + "type": "file", + "name": "dynamic-remote", + "label": "Dynamic load provider" + } +] diff --git a/apps/website-new/docs/en/practice/frameworks/next/_meta.json b/apps/website-new/docs/en/practice/frameworks/next/_meta.json index 9d91eff3307..35853b1c1f8 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/_meta.json +++ b/apps/website-new/docs/en/practice/frameworks/next/_meta.json @@ -1 +1,27 @@ -["index", "importing-components","importing-pages","express","presets"] +[ + { + "type": "file", + "name": "index", + "label": "Next.js Integration" + }, + { + "type": "file", + "name": "importing-components", + "label": "Component Importing" + }, + { + "type": "file", + "name": "importing-pages", + "label": "Page Importing" + }, + { + "type": "file", + "name": "express", + "label": "Express Integration" + }, + { + "type": "file", + "name": "presets", + "label": "Preset Configuration" + } +] diff --git a/apps/website-new/docs/en/practice/frameworks/next/dynamic-remotes.mdx b/apps/website-new/docs/en/practice/frameworks/next/dynamic-remotes.mdx index 808caa0ec15..147edf346fb 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/dynamic-remotes.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/dynamic-remotes.mdx @@ -1,5 +1,5 @@ --- -title: Dynamic Remotes | Next.js Federation +title: Dynamic Remotes description: Guide to implementing dynamic remote loading in Next.js Module Federation, including runtime initialization and custom remote configuration. --- diff --git a/apps/website-new/docs/en/practice/frameworks/next/express.mdx b/apps/website-new/docs/en/practice/frameworks/next/express.mdx index 786773b0bcf..7eae746b638 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/express.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/express.mdx @@ -1,5 +1,5 @@ --- -title: Express Integration | Next.js Federation +title: Express Integration description: Guide to using Express.js with Next.js Module Federation, including hot module reloading setup and route cache management. --- diff --git a/apps/website-new/docs/en/practice/frameworks/next/importing-components.mdx b/apps/website-new/docs/en/practice/frameworks/next/importing-components.mdx index ab3af224c41..817cd9ab200 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/importing-components.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/importing-components.mdx @@ -1,5 +1,5 @@ --- -title: Component Importing | Next.js Federation +title: Component Importing description: Learn different methods for importing federated components in Next.js, including lazy loading, eager imports, and client-side only components. --- diff --git a/apps/website-new/docs/en/practice/frameworks/next/importing-pages.mdx b/apps/website-new/docs/en/practice/frameworks/next/importing-pages.mdx index 35a10808863..1e7b85b3111 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/importing-pages.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/importing-pages.mdx @@ -1,5 +1,5 @@ --- -title: Page Importing | Next.js Federation +title: Page Importing description: Guide to importing and routing federated pages in Next.js, including handling data fetching methods and page lifecycle management. --- diff --git a/apps/website-new/docs/en/practice/frameworks/next/index.mdx b/apps/website-new/docs/en/practice/frameworks/next/index.mdx index e4431dc537e..58897f6b7af 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/index.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/index.mdx @@ -1,5 +1,5 @@ --- -title: Next.js Integration | Module Federation Practice +title: Next.js Integration description: Guide to integrating Module Federation with Next.js, including SSR setup, environment configuration, and project initialization for Pages Router. --- diff --git a/apps/website-new/docs/en/practice/frameworks/next/presets.mdx b/apps/website-new/docs/en/practice/frameworks/next/presets.mdx index a407af0244f..10c39e9b20c 100644 --- a/apps/website-new/docs/en/practice/frameworks/next/presets.mdx +++ b/apps/website-new/docs/en/practice/frameworks/next/presets.mdx @@ -1,5 +1,5 @@ --- -title: Preset Configuration | Next.js Federation +title: Preset Configuration description: Overview of Next.js Module Federation presets, including shared dependencies, page exposure configuration, and build options. --- diff --git a/apps/website-new/docs/en/practice/frameworks/react/_meta.json b/apps/website-new/docs/en/practice/frameworks/react/_meta.json index 5c817e06ae4..8453e2f265a 100644 --- a/apps/website-new/docs/en/practice/frameworks/react/_meta.json +++ b/apps/website-new/docs/en/practice/frameworks/react/_meta.json @@ -1 +1,17 @@ -["index", "using-nx-for-react", "i18n-react"] +[ + { + "type": "file", + "name": "index", + "label": "React with Rsbuild" + }, + { + "type": "file", + "name": "using-nx-for-react", + "label": "Nx CLI Integration" + }, + { + "type": "file", + "name": "i18n-react", + "label": "React i18n Integration" + } +] diff --git a/apps/website-new/docs/en/practice/frameworks/react/i18n-react.mdx b/apps/website-new/docs/en/practice/frameworks/react/i18n-react.mdx index 6bccaf58759..942fa51b2bd 100644 --- a/apps/website-new/docs/en/practice/frameworks/react/i18n-react.mdx +++ b/apps/website-new/docs/en/practice/frameworks/react/i18n-react.mdx @@ -1,5 +1,5 @@ --- -title: React i18n Integration | Module Federation Practice +title: React i18n Integration description: Guide to implementing internationalization (i18n) in React micro-frontends using Module Federation, including language synchronization and state management. --- diff --git a/apps/website-new/docs/en/practice/frameworks/react/index.mdx b/apps/website-new/docs/en/practice/frameworks/react/index.mdx index 5fffd7864db..cd437516e31 100644 --- a/apps/website-new/docs/en/practice/frameworks/react/index.mdx +++ b/apps/website-new/docs/en/practice/frameworks/react/index.mdx @@ -1,5 +1,5 @@ --- -title: React with Rsbuild | Module Federation Practice +title: React with Rsbuild description: Step-by-step guide to setting up a React application with Rsbuild and Module Federation, including environment setup and component sharing. --- diff --git a/apps/website-new/docs/en/practice/frameworks/react/using-nx-for-react.mdx b/apps/website-new/docs/en/practice/frameworks/react/using-nx-for-react.mdx index 344347f9e20..3ac45fdcd9a 100644 --- a/apps/website-new/docs/en/practice/frameworks/react/using-nx-for-react.mdx +++ b/apps/website-new/docs/en/practice/frameworks/react/using-nx-for-react.mdx @@ -1,5 +1,5 @@ --- -title: Nx CLI Integration | Module Federation Practice +title: Nx CLI Integration description: Comprehensive guide to using Nx CLI for React projects with Module Federation, including host and remote application setup, development workflow, and build processes. ---