@modern-js/main-doc 3.0.1 → 3.0.2

package/docs/zh/guides/topic-detail/module-federation/usage.mdx

@@ -1,6 +1,6 @@
 # 开始使用
 
-在 Modern.js 中使用 Module Federation 我们推荐使用官方插件 `@module-federation/modern-js`。
+在 Modern.js 中使用 Module Federation 我们推荐使用官方插件 `@module-federation/modern-js-v3`。
 
 本章节将会介绍如何通过官方插件搭含生产者应用与消费者应用，我们首先根据 [Modern.js 快速上手](/guides/get-started/quick-start) 创建两个应用。
 
@@ -10,7 +10,7 @@
 
 import { PackageManagerTabs } from '@theme';
 
-<PackageManagerTabs command="add @module-federation/modern-js" />
+<PackageManagerTabs command="add @module-federation/modern-js-v3" />
 
 ## 注册插件
 
@@ -18,7 +18,7 @@ import { PackageManagerTabs } from '@theme';
 
 ```ts
 import { appTools, defineConfig } from '@modern-js/app-tools';
-import { moduleFederationPlugin } from '@module-federation/modern-js';
+import { moduleFederationPlugin } from '@module-federation/modern-js-v3';
 
 export default defineConfig({
   plugins: [appTools(), moduleFederationPlugin()],
@@ -42,7 +42,7 @@ export const Button = () => {
 随后，在项目根目录添加 `module-federation.config.ts`，配置 Module Federation 模块的名称、共享依赖和导出内容：
 
 ```ts title="module-federation.config.ts"
-import { createModuleFederationConfig } from '@module-federation/modern-js';
+import { createModuleFederationConfig } from '@module-federation/modern-js-v3';
 
 export default createModuleFederationConfig({
   name: 'remote',
@@ -68,7 +68,7 @@ export default createModuleFederationConfig({
 
 ```ts title="modern.config.ts"
 import { appTools, defineConfig } from '@modern-js/app-tools';
-import { moduleFederationPlugin } from '@module-federation/modern-js';
+import { moduleFederationPlugin } from '@module-federation/modern-js-v3';
 
 export default defineConfig({
   server: {
@@ -85,7 +85,7 @@ export default defineConfig({
 在项目根目录添加 `module-federation.config.ts`，配置 Module Federation 模块的名称、共享依赖和使用的远程模块：
 
 ```ts title="module-federation.config.ts"
-import { createModuleFederationConfig } from '@module-federation/modern-js';
+import { createModuleFederationConfig } from '@module-federation/modern-js-v3';
 
 export default createModuleFederationConfig({
   name: 'host',
@@ -170,7 +170,7 @@ export default Index;
 
 ```ts
 import { appTools, defineConfig } from '@modern-js/app-tools';
-import { moduleFederationPlugin } from '@module-federation/modern-js';
+import { moduleFederationPlugin } from '@module-federation/modern-js-v3';
 
 // https://modernjs.dev/en/configure/app/usage
 export default defineConfig({

package/docs/zh/guides/troubleshooting/builder.mdx

@@ -10,11 +10,11 @@ sidebar_position: 3
 
 ### Rsbuild FAQ
 
-Modern.js 内部基于 [Rsbuild](https://rsbuild.rs/) 封装了自身的构建工具，因此你可以直接参考 Rsbuild 的 FAQ 文档：
+Modern.js 内部基于 [Rsbuild](https://v2.rsbuild.dev/) 封装了自身的构建工具，因此你可以直接参考 Rsbuild 的 FAQ 文档：
 
-- [Rsbuild - 功能类问题](https://rsbuild.rs/zh/guide/faq/features)
-- [Rsbuild - 异常类问题](https://rsbuild.rs/zh/guide/faq/exceptions)
-- [Rsbuild - 热更新问题](https://rsbuild.rs/zh/guide/faq/hmr)
+- [Rsbuild - 功能类问题](https://v2.rsbuild.dev/zh/guide/faq/features)
+- [Rsbuild - 异常类问题](https://v2.rsbuild.dev/zh/guide/faq/exceptions)
+- [Rsbuild - 热更新问题](https://v2.rsbuild.dev/zh/guide/faq/hmr)
 
 ---
 

package/docs/zh/guides/upgrade/config.mdx

@@ -151,12 +151,40 @@ export default {
 
 ## tools
 
+### toos.postcss
+
+**变更内容**：对象式配置会覆盖 Modern.js 内置的 PostCSS 配置。如果需要在内置配置基础上进行扩展，请使用函数式配置。
+
+```typescript
+// v2
+export default {
+  tools: {
+    postcss: {
+      postcssOptions: {
+        plugins: [tailwindcssPlugin],
+      },
+    },
+  },
+};
+```
+
+```typescript
+// v3
+export default {
+  tools: {
+    postcss: (opts, { addPlugins }) => {
+      addPlugins(tailwindcssPlugin);
+    },
+  },
+};
+```
+
 ### tools.esbuild
 
 **变更内容**：该配置已废弃，需要手动切换到 esbuild 压缩。
 
 ```typescript
-// 该配置已废弃，请参考 [切换压缩器](https://rsbuild.rs/zh/config/output/minify#%E5%88%87%E6%8D%A2%E5%8E%8B%E7%BC%A9%E5%99%A8) 来手动切换到 esbuild 压缩
+// 该配置已废弃，请参考 [切换压缩器](https://v2.rsbuild.dev/zh/config/output/minify#%E5%88%87%E6%8D%A2%E5%8E%8B%E7%BC%A9%E5%99%A8) 来手动切换到 esbuild 压缩
 // tools: {
 //   esbuild: { /* 配置 */ }
 // },
@@ -167,7 +195,7 @@ export default {
 **变更内容**：该配置已废弃，需要手动切换到 Terser 压缩。
 
 ```typescript
-// 该配置已废弃，请参考 [切换压缩器](https://rsbuild.rs/zh/config/output/minify#%E5%88%87%E6%8D%A2%E5%8E%8B%E7%BC%A9%E5%99%A8) 来手动切换到 Terser 压缩
+// 该配置已废弃，请参考 [切换压缩器](https://v2.rsbuild.dev/zh/config/output/minify#%E5%88%87%E6%8D%A2%E5%8E%8B%E7%BC%A9%E5%99%A8) 来手动切换到 Terser 压缩
 // tools: {
 //   terser: { /* 配置 */ }
 // },
@@ -893,7 +921,7 @@ export default defineRuntimeConfig({
 
 ### performance.bundleAnalyze
 
-**变更内容**：该配置已废弃，建议使用 [Rsdoctor](https://rsbuild.rs/zh/guide/debug/rsdoctor) 来分析产物体积
+**变更内容**：该配置已废弃，建议使用 [Rsdoctor](https://v2.rsbuild.dev/zh/guide/debug/rsdoctor) 来分析产物体积
 
 ### performance.transformLodash
 

package/docs/zh/plugin/cli-plugins/api.mdx

@@ -188,7 +188,7 @@ api.config(() => {
 - **参数：**
   - `modifyFn`： 修改函数，接收 `RspackChain` 实例和实用工具作为参数。
 - **执行阶段：** 在生成最终的 Rspack 配置时。
-- **对应 Rsbuild Hook**： [modifybundlerchain](https://rsbuild.rs/zh/plugins/dev/hooks#modifybundlerchain)
+- **对应 Rsbuild Hook**： [modifybundlerchain](https://v2.rsbuild.dev/zh/plugins/dev/hooks#modifybundlerchain)
 - **示例：**
 
 ```typescript
@@ -208,7 +208,7 @@ api.modifyBundlerChain((chain, utils) => {
 - **参数：**
   - `modifyFn`： 修改函数，接收 Rsbuild 配置对象和实用工具作为参数，可以返回修改后的配置对象、Promise 或不返回（直接修改原对象）。
 - **执行阶段：** 在生成最终的 Rsbuild 配置时。
-- **对应 Rsbuild Hook**： [modifyRsbuildConfig](https://rsbuild.rs/zh/plugins/dev/hooks#modifyrsbuildconfig)
+- **对应 Rsbuild Hook**： [modifyRsbuildConfig](https://v2.rsbuild.dev/zh/plugins/dev/hooks#modifyrsbuildconfig)
 - **示例：**
 
 ```typescript
@@ -228,7 +228,7 @@ api.modifyRsbuildConfig((config, utils) => {
 - **参数：**
   - `modifyFn`： 修改函数，接收 Rspack 配置对象和实用工具作为参数，可以返回修改后的配置对象、Promise 或不返回（直接修改原对象）。
 - **执行阶段：** 在生成最终的 Rspack 配置时。
-- **对应 Rsbuild Hook**： [modifyRspackConfig](https://rsbuild.rs/zh/plugins/dev/hooks#modifyrspackconfig)
+- **对应 Rsbuild Hook**： [modifyRspackConfig](https://v2.rsbuild.dev/zh/plugins/dev/hooks#modifyrspackconfig)
 - **示例：**
 
 ```typescript
@@ -403,7 +403,7 @@ api.onFileChanged(({ filename, eventType }) => {
 - **参数：**
   - `buildFn`： 构建前执行的函数，无参数，可异步。
 - **执行阶段：** 在执行构建流程之前。
-- **对应 Rsbuild Hook**： [onBeforeBuild](https://rsbuild.rs/zh/plugins/dev/hooks#onbeforebuild)
+- **对应 Rsbuild Hook**： [onBeforeBuild](https://v2.rsbuild.dev/zh/plugins/dev/hooks#onbeforebuild)
 - **示例：**
 
 ```typescript
@@ -422,7 +422,7 @@ api.onBeforeBuild(() => {
 - **参数：**
   - `buildFn`： 构建后执行的函数，无参数，可异步。
 - **执行阶段：** 在执行构建流程之后。
-- **对应 Rsbuild Hook**： [onAfterBuild](https://rsbuild.rs/zh/plugins/dev/hooks#onafterbuild)
+- **对应 Rsbuild Hook**： [onAfterBuild](https://v2.rsbuild.dev/zh/plugins/dev/hooks#onafterbuild)
 - **示例：**
 
 ```typescript
@@ -441,7 +441,7 @@ api.onAfterBuild(() => {
 - **参数：**
   - `compileFn`： 编译完成后执行的函数。
 - **执行阶段：** 开发服务器启动，且首次编译完成后。
-- **对应 Rsbuild Hook**： [onDevCompileDone](https://rsbuild.rs/zh/plugins/dev/hooks#ondevcompiledone)
+- **对应 Rsbuild Hook**： [onDevCompileDone](https://v2.rsbuild.dev/zh/plugins/dev/hooks#ondevcompiledone)
 - **示例：**
 
 ```typescript
@@ -460,7 +460,7 @@ api.onDevCompileDone(() => {
 - **参数：**
   - `createFn`： 创建前执行的函数，无参数，可异步。
 - **执行阶段：** 在创建 Rspack 编译器实例之前。
-- **对应 Rsbuild Hook**： [onBeforeCreateCompiler](https://rsbuild.rs/zh/plugins/dev/hooks#onbeforecreatecompiler)
+- **对应 Rsbuild Hook**： [onBeforeCreateCompiler](https://v2.rsbuild.dev/zh/plugins/dev/hooks#onbeforecreatecompiler)
 - **示例：**
 
 ```typescript
@@ -479,7 +479,7 @@ api.onBeforeCreateCompiler(() => {
 - **参数：**
   - `createFn`： 创建后执行的函数，无参数，可异步。
 - **执行阶段：** 在创建 Rspack 编译器实例之后。
-- **对应 Rsbuild Hook**： [onAfterCreateCompiler](https://rsbuild.rs/zh/plugins/dev/hooks#onaftercreatecompiler)
+- **对应 Rsbuild Hook**： [onAfterCreateCompiler](https://v2.rsbuild.dev/zh/plugins/dev/hooks#onaftercreatecompiler)
 - **示例：**
 
 ```typescript
@@ -517,7 +517,7 @@ api.onBeforeDev(async () => {
 - **参数：**
   - `devFn`： 开发服务器启动后执行的函数。
 - **执行阶段：** 开发服务器成功启动后。
-- **对应 Rsbuild Hook**： [onAfterStartDevServer](https://rsbuild.rs/zh/plugins/dev/hooks#onafterstartdevserver)
+- **对应 Rsbuild Hook**： [onAfterStartDevServer](https://v2.rsbuild.dev/zh/plugins/dev/hooks#onafterstartdevserver)
 - **示例：**
 
 ```typescript

package/docs/zh/plugin/introduction.mdx

@@ -117,7 +117,7 @@ Rsbuild 是 Modern.js 底层的构建工具，通过添加 Rsbuild 插件可修
 你可以在 `modern.config.ts` 中通过 `builderPlugins` 选项注册 Rsbuild 插件，详见 [builderPlugins 构建插件](/configure/app/builder-plugins.html)。
 
 :::info
-可以阅读 [Rsbuild 官网 - 插件](https://rsbuild.rs/plugins/list/index) 了解更多 Rsbuild 插件体系内容。
+可以阅读 [Rsbuild 官网 - 插件](https://v2.rsbuild.dev/plugins/list/index) 了解更多 Rsbuild 插件体系内容。
 :::
 
 ### 官方插件
@@ -128,9 +128,9 @@ Rsbuild 是 Modern.js 底层的构建工具，通过添加 Rsbuild 插件可修
 
 | 插件                                                                                 | 介绍                                                                                   | Modern.js 链接                                                                                                                        |
 | ------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------- |
-| [React 插件](https://rsbuild.rs/zh/plugins/list/plugin-react)                        | 提供对 React 的支持                                                                    | -                                                                                                                                     |
-| [SVGR 插件](https://rsbuild.rs/zh/plugins/list/plugin-svgr)                          | 支持将 SVG 图片转换为一个 React 组件                                                   | [output.disableSvgr](/configure/app/output/disable-svgr)<br />[output.svgDefaultExport](/configure/app/output/svg-default-export)     |
-| [Assets Retry 插件](https://rsbuild.rs/zh/plugins/list/plugin-assets-retry)          | 用于在静态资源加载失败时自动发起重试请求                                               | [output.assetsRetry](/configure/app/output/assets-retry.html)                                                                         |
+| [React 插件](https://v2.rsbuild.dev/zh/plugins/list/plugin-react)                        | 提供对 React 的支持                                                                    | -                                                                                                                                     |
+| [SVGR 插件](https://v2.rsbuild.dev/zh/plugins/list/plugin-svgr)                          | 支持将 SVG 图片转换为一个 React 组件                                                   | [output.disableSvgr](/configure/app/output/disable-svgr)<br />[output.svgDefaultExport](/configure/app/output/svg-default-export)     |
+| [Assets Retry 插件](https://github.com/rstackjs/rsbuild-plugin-assets-retry)          | 用于在静态资源加载失败时自动发起重试请求                                               | [output.assetsRetry](/configure/app/output/assets-retry.html)                                                                         |
 | [Type Check 插件](https://github.com/rspack-contrib/rsbuild-plugin-type-check)       | 用于在单独的进程中运行 TypeScript 类型检查                                             | [output.disableTsChecker](/configure/app/output/disable-ts-checker.html)<br />[tools.tsChecker](/configure/app/tools/ts-checker.html) |
 | [Source Build 插件](https://github.com/rspack-contrib/rsbuild-plugin-source-build)   | 用于 monorepo 场景，支持引用其他子目录的源代码，并完成构建和热更新                     | [experiments.sourceBuild](/configure/app/experiments/source-build.html)                                                               |
 | [Check Syntax 插件](https://github.com/rspack-contrib/rsbuild-plugin-check-syntax)   | 用于分析产物的语法兼容性，判断是否存在导致兼容性问题的高级语法                         | [security.checkSyntax](/configure/app/security/check-syntax.html)                                                                     |
@@ -142,7 +142,7 @@ Rsbuild 是 Modern.js 底层的构建工具，通过添加 Rsbuild 插件可修
 以下是未在 Modern.js 中内置的 Rsbuild 官方插件：
 
 - [Image Compress 插件](https://github.com/rspack-contrib/rsbuild-plugin-image-compress)：将项目中用到的图片资源进行压缩处理。
-- [Stylus 插件](https://rsbuild.rs/zh/plugins/list/plugin-stylus)：使用 Stylus 作为 CSS 预处理器。
+- [Stylus 插件](https://v2.rsbuild.dev/zh/plugins/list/plugin-stylus)：使用 Stylus 作为 CSS 预处理器。
 - [UMD 插件](https://github.com/rspack-contrib/rsbuild-plugin-umd)：用于构建 UMD 格式的产物。
 - [YAML 插件](https://github.com/rspack-contrib/rsbuild-plugin-yaml)：用于引用 YAML 文件，并将其转换为 JavaScript 对象。
 - [TOML 插件](https://github.com/rspack-contrib/rsbuild-plugin-toml)：用于引用 TOML 文件，并将其转换为 JavaScript 对象。

package/package.json

@@ -16,14 +16,14 @@
     "modern",
     "modern.js"
   ],
-  "version": "3.0.1",
+  "version": "3.0.2",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
   "dependencies": {
     "mermaid": "^11.12.2",
-    "@modern-js/sandpack-react": "3.0.1"
+    "@modern-js/sandpack-react": "3.0.2"
   },
   "devDependencies": {
     "@rsbuild/plugin-sass": "1.5.0",

package/src/components/RsbuildLink/index.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 
 const RsbuildLink = ({ configName }: { configName: string }) => {
   const lang = useLang();
-  const href = `https://v2.rsbuild.rs/${lang === 'zh' ? 'zh/' : ''}config/${configName
+  const href = `https://v2.rsbuild.dev/${lang === 'zh' ? 'zh/' : ''}config/${configName
     .split('.')
     .join('/')
     .replace(/([a-z])([A-Z])/g, '$1-$2')

package/src/pages/index.tsx

@@ -16,7 +16,7 @@ const HomepageHeader = () => {
         <div className={styles.mask} />
         <h1 className={styles.title}>
           <span className={clsx([styles.titleGradient, styles.mainTitle])}>
-            Modern.js
+            Modern.js 3.0
           </span>
           <div>{t('slogan')}</div>
         </h1>