Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 8 additions & 8 deletions website/docs/en/guide/advanced/module-federation.mdx
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
# Module Federation

Module Federation is an architectural pattern for JavaScript application decomposition (similar to microservices on the server-side), allowing you to share code and resources between multiple JavaScript applications (or micro-frontends).
Module Federation is an architectural pattern for decomposing JavaScript applications—similar to server-side microservices—that lets you share code and resources between multiple JavaScript applications (or micro-frontends).
Comment thread
chenjiahan marked this conversation as resolved.
Outdated

The Rspack team works closely with the Module Federation development team and provides first-class support for Module Federation.
The Rspack team works closely with the Module Federation maintainers to deliver first-class support.

## Use cases

Expand All @@ -21,9 +21,9 @@ Module Federation can help you:

## How to use

Module Federation (MF) currently has multiple major versions, and you can choose one based on your needs.
Module Federation (MF) currently offers multiple major versions; choose the one that fits your needs.

Here are the characteristics of several versions:
The key characteristics of each version are:

| Version | Description | Features | Use Cases |
| ------- | ---------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------- |
Expand All @@ -32,7 +32,7 @@ Here are the characteristics of several versions:

### Module Federation v2.0

[Module Federation 2.0](https://module-federation.io/blog/announcement.html) provides additional out-of-the-box features based on Module Federation, such as dynamic TS type hints, Chrome devtools, Runtime plugins, and preloading, making Module Federation better suited for micro-frontend architecture supporting large-scale web applications. Module Federation v2.0 is implemented based on v1.5.
[Module Federation 2.0](https://module-federation.io/blog/announcement.html) provides additional out-of-the-box features based on Module Federation, such as dynamic TS type hints, Chrome devtools, Runtime plugins, and preloading, which makes Module Federation better suited for micro-frontend architecture supporting large-scale web applications. Module Federation v2.0 is implemented based on v1.5.

You need to install the additional [@module-federation/rsbuild-plugin](https://npmjs.com/package/@module-federation/rsbuild-plugin) plugin to use Module Federation v2.0.

Expand All @@ -53,9 +53,9 @@ Please refer to the [Module Federation v2.0 official documentation](https://modu

### Module Federation v1.5

This is the version built into Rspack. In addition to supporting Module Federation v1.0's capabilities such as module export, module loading, and dependency sharing, it also adds runtime plugin functionality, allowing users to extend the behavior and functionality of module federation.
This is the version built into Rspack. In addition to supporting Module Federation v1.0's capabilities such as module export, module loading, and dependency sharing, it also adds runtime plugin functionality, letting you extend the behavior and functionality of module federation.

You can use it through Rsbuild's [moduleFederation.options](/config/module-federation/options), no need to install any plugins.
You can enable it through Rsbuild's [moduleFederation.options](/config/module-federation/options) without installing additional plugins.

```ts title="rsbuild.config.ts"
export default defineConfig({
Expand All @@ -70,7 +70,7 @@ export default defineConfig({

## Example repositories

Rsbuild has provided some example projects of Module Federation, you can refer to:
Rsbuild provides Module Federation example projects you can explore:

- [Module Federation v2.0 Example](https://github.com/rspack-contrib/rstack-examples/tree/main/rsbuild/module-federation-enhanced)
- [Module Federation v1.5 Example](https://github.com/rspack-contrib/rstack-examples/tree/main/rsbuild/module-federation)
4 changes: 2 additions & 2 deletions website/docs/en/guide/advanced/testing.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,13 @@

Rsbuild doesn't include built-in testing frameworks, but integrates seamlessly with popular testing tools.

This guide will introduce how to add [unit testing](#unit-testing) and [end-to-end testing](#end-to-end-testing) to Rsbuild applications.
This guide shows how to add [unit testing](#unit-testing) and [end-to-end testing](#end-to-end-testing) to Rsbuild applications.

## Unit testing

Unit tests verify individual components and functions in isolation. Rsbuild can work with testing frameworks like [Rstest](https://rstest.rs), [Vitest](https://vitest.dev/), [Jest](https://jestjs.io/), and others.

The following example uses Rstest to demonstrate how to add unit testing to a Rsbuild application.
The following example uses Rstest to show how to add unit tests to an Rsbuild application.

### Rstest

Expand Down
10 changes: 5 additions & 5 deletions website/docs/en/guide/migration/vite.mdx
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
# Vite

This chapter introduces how to migrate a Vite project to Rsbuild.
This guide explains how to migrate a Vite project to Rsbuild.

## Installing dependencies

First, you need to replace the npm dependencies of Vite with Rsbuild's dependencies.
First, replace Vite's npm dependencies with Rsbuild's equivalents.

import { PackageManagerTabs } from '@theme';

Expand All @@ -18,7 +18,7 @@ import { PackageManagerTabs } from '@theme';

## Updating npm scripts

Next, you need to update the npm scripts in your package.json to use Rsbuild's CLI commands.
Next, update the npm scripts in your package.json to run Rsbuild CLI commands.

```json title="package.json"
{
Expand All @@ -35,7 +35,7 @@ Next, you need to update the npm scripts in your package.json to use Rsbuild's C

## Create configuration file

Create a Rsbuild configuration file `rsbuild.config.ts` in the same directory as package.json, and add the following content:
Create an Rsbuild configuration file `rsbuild.config.ts` in the same directory as package.json, and add the following content:

```ts title="rsbuild.config.ts"
import { defineConfig } from '@rsbuild/core';
Expand All @@ -58,7 +58,7 @@ Using a newly created Vite project as an example, first delete the `<script>` ta
<script type="module" src="/src/main.ts"></script>
```

Then add the following config.
Then add the following configuration:

```ts title="rsbuild.config.ts"
export default {
Expand Down
Loading