@modern-js/main-doc 2.3.0 → 2.5.0

package/zh/apis/app/runtime/core/use-module-apps.mdx

@@ -25,20 +25,31 @@ import EnableMicroFrontend from "@site-docs/components/enable-micro-frontend";
 
 <EnableMicroFrontend />
 
+这里演示主应用为自控式路由的场景，全部场景参考 [体验微前端](/guides/topic-detail/micro-frontend/c02-development.html)
 ```tsx title=App.tsx
 function App() {
-  const { Home, Contact } = useModuleApps();
+  const { apps, MApp, Table, Dashboard } = useModuleApps();
+
+  // 使用的不是 MApp 组件，需要使用 createBrowserRouter 来创建路由
+  const router = createBrowserRouter(
+    createRoutesFromElements(
+      <Route path="/" element={<AppLayout />}>
+        <Route key={'table'} path={'table/*'} element={<Table />} />
+        <Route key={'dashboard'} path={'dashboard/*'} element={<Dashboard />} />
+      </Route>
+    )
+  );
 
   return (
-    <div>
-      Master APP
-      <Route exact path="/home">
-        <Home />
-      </Route>
-      <Route exact path="/home">
-        <Contact />
-      </Route>
-    </div>
+    // 方法一：使用 MApp 自动根据配置的 activeWhen 参数加载子应用(本项目配置在 modern.config.ts 中)
+    // <BrowserRouter>
+    //   <MApp />
+    // </BrowserRouter>
+
+    // 方法二：手动写 Route 组件方式加载子应用，方便于需要鉴权等需要前置操作的场景
+    <>
+      <RouterProvider router={router} />
+    </>
   );
 }
 
@@ -47,11 +58,11 @@ defineConfig(App, {
     apps: [
       {
         // name 区分大小写，name 提供的是什么 useModuleApps 返回的就是什么
-        name: 'Home',
+        name: 'Table',
         entry: 'http://127.0.0.1:8081/',
       },
       {
-        name: 'Contact',
+        name: 'Dashboard',
         entry: 'http://localhost:8082',
       },
     ],
@@ -59,7 +70,7 @@ defineConfig(App, {
 });
 ```
 
-通过 `useModuleApps()` 获取到 `Home` 和 `Contact` 子应用组件（名称和配置里的 `name` 字段对应），之后就可以像使用普通的 React 组件一样去加载子应用。
+通过 `useModuleApps()` 获取到 `Table` 和 `Dashboard` 子应用组件（名称和配置里的 `name` 字段对应），之后就可以像使用普通的 React 组件一样去加载子应用。
 
 ### 集中式路由
 
@@ -89,13 +100,13 @@ defineConfig(App, {
     apps: [
       {
         // name 区分大小写，name 提供的是什么 useModuleApps 返回的就是什么
-        name: 'Dashboard',
-        activeWhen: '/dashboard',
+        name: 'Table',
+        activeWhen: '/table',
         entry: 'http://127.0.0.1:8081/',
       },
       {
-        name: 'TableList',
-        activeWhen: '/table',
+        name: 'Dashboard',
+        activeWhen: '/dashboard',
         entry: 'http://localhost:8082',
       },
     ],
@@ -103,36 +114,66 @@ defineConfig(App, {
 });
 ```
 
-这样启动应用后，访问 `/dashboard` 路由，会渲染 `Dashboard` 子应用，访问 `/table` 路由，会渲染 `TableList` 子应用。
+这样启动应用后，访问 `/dashboard` 路由，会渲染 `Dashboard` 子应用，访问 `/table` 路由，会渲染 `Table` 子应用。
 
 ## 加载动画
 
 可以通过以下方式，自定义组件加载过程的过渡动画。
 
-```tsx title=App.tsx
-function App() {
-  const { Home } = useModuleApps();
+```js title="App.tsx"
+import { useModuleApps } from '@modern-js/plugin-garfish/runtime';
 
-  return (
-    <div>
-      Master APP
-      <Route exact path="/home">
-        <Home
-          loadable={{
-            loading: ({ pastDelay, error }: any) => {
-              if (error) {
-                console.error(error);
-                return <div>error: {error?.message}</div>;
-              } else if (pastDelay) {
-                return <div>loading</div>;
-              } else {
-                return null;
+import { RouterProvider, Route, createBrowserRouter, createRoutesFromElements, BrowserRouter, Link, Outlet } from '@modern-js/runtime/router';
+
+const AppLayout = () => (
+  <>
+    <div><Link to={'/table'}>加载约定式路由子应用</Link></div>
+    <div><Link to={'/dashboard'}>加载自控式路由子应用</Link></div>
+    <div><Link to={'/'}>卸载子应用</Link></div>
+    <Outlet />
+  </>
+)
+
+export default () => {
+  const { apps } = useModuleApps();
+
+  // 使用的不是 MApp 组件，需要使用 createBrowserRouter 来创建路由
+  const router = createBrowserRouter(
+    createRoutesFromElements(
+      <Route path="/" element={<AppLayout />}>
+        {apps.map(app => {
+          const { Component } = app;
+          // 模糊匹配，path 需要写成类似 abc/* 的模式
+          return (
+            <Route
+              key={app.name}
+              path={`${app.name.toLowerCase()}/*`}
+              element={
+              <Component
+                loadable={{
+                  loading: ({ pastDelay, error }: any) => {
+                    if (error) {
+                      return <div>error: {error?.message}</div>;
+                    } else if (pastDelay) {
+                      return <div>loading</div>;
+                    } else {
+                      return null;
+                    }
+                  },
+                }}
+              />
               }
-            },
-          }}
-        />
+            />
+          )
+        })}
       </Route>
-    </div>
+    )
   );
-}
+
+  return (
+    <>
+      <RouterProvider router={router} />
+    </>
+  );
+};
 ```

package/zh/apis/app/runtime/model/Provider.mdx

@@ -21,8 +21,8 @@ interface ProviderProps {
 
 ### 参数
 
-- store：[`createStore`](./create-store.md) 创建的 Store 对象。
-- config：创建 Reduck Store 的配置，同 [`createApp`](./create-app.md) 的 `config` 参数。
+- store：[`createStore`](./create-store.mdx) 创建的 Store 对象。
+- config：创建 Reduck Store 的配置，同 [`createApp`](./create-app.mdx) 的 `config` 参数。
 
 ## 示例
 

package/zh/apis/app/runtime/model/create-app.mdx

@@ -29,19 +29,19 @@ function createApp(config: AppConfig): object;
 ### 参数
 
 - config：`Record<string, any>`
-  - StoreConfig：同 [`createStore`](./create-store.md) 的参数。
+  - StoreConfig：同 [`createStore`](./create-store.mdx) 的参数。
   - devTools：默认值为 true。是否开启 Redux DevTools，当为对象类型时，支持配置 Redux DevTools 的 [Options](https://github.com/reduxjs/redux-devtools/blob/main/extension/docs/API/Arguments.md)。
-  - autoActions：默认值为 true。是否[自动生成 Actions](./auto-actions.md)。
+  - autoActions：默认值为 true。是否[自动生成 Actions](./auto-actions.mdx)。
 
 ### 返回值
 
 Reduck App，有以下属性组成：
 
-- Provider：为应用局部的组件树注入共享 Store 的组件。用法同 [`Provider`](./Provider.md)。
-- useModel：获取应用局部 Store 挂载的 Model 对象。用法同 [`useModel`](./use-model.md)。
-- useStaticModel：获取应用局部 Store 挂载的 Model 对象。用法同 [`useStaticModel`](./use-static-model.md)。
-- useLocalModel：获取应用局部 Store 挂载的 Model 对象。用法同 [`useLocalModel`](./use-local-model.md)。
-- useStore：获取应用局部使用的 Store 对象。用法同 [`useStore`](./use-store.md)。
+- Provider：为应用局部的组件树注入共享 Store 的组件。用法同 [`Provider`](./Provider.mdx)。
+- useModel：获取应用局部 Store 挂载的 Model 对象。用法同 [`useModel`](./use-model.mdx)。
+- useStaticModel：获取应用局部 Store 挂载的 Model 对象。用法同 [`useStaticModel`](./use-static-model.mdx)。
+- useLocalModel：获取应用局部 Store 挂载的 Model 对象。用法同 [`useLocalModel`](./use-local-model.mdx)。
+- useStore：获取应用局部使用的 Store 对象。用法同 [`useStore`](./use-store.mdx)。
 
 ## 示例
 

package/zh/apis/app/runtime/model/create-store.mdx

@@ -10,7 +10,7 @@ import ReduckTip from "@site-docs/components/reduck-tip"
 
 `createStore` 用于创建一个 Store 对象。Reduck 的 Store 基于 Redux 的 [Store](https://redux.js.org/api/store) 实现，用于存储应用的状态，同时提供一组用于管理状态和 Model 的方法。
 
-一般情况下，不需要使用这个 API，只有需要完全掌控 Store 的创建时，才会使用这个 API。例如，自定义一个 Store，传入 [`Provider`](./Provider.md) 组件使用。
+一般情况下，不需要使用这个 API，只有需要完全掌控 Store 的创建时，才会使用这个 API。例如，自定义一个 Store，传入 [`Provider`](./Provider.mdx) 组件使用。
 
 ## 函数签名
 
@@ -44,7 +44,7 @@ function createStore(config: StoreConfig): ReduckStore;
 
 Reduck Store 对象：
 
-- use：动态挂载和获取 Model 对象。用法与 [`useModel`](./use-model.md) 相同，但可以在 React 组件外使用。
+- use：动态挂载和获取 Model 对象。用法与 [`useModel`](./use-model.mdx) 相同，但可以在 React 组件外使用。
 - unmount：卸载 Model 对象，Model 的 State 会从 Store 中清除。
 - ReduxStore：Redux Store 对象具有的方法，[详见](https://redux.js.org/tutorials/fundamentals/part-4-store#redux-store)。
 

package/zh/apis/app/runtime/model/use-local-model.mdx

@@ -8,7 +8,7 @@ import ReduckTip from "@site-docs/components/reduck-tip"
 
 <ReduckTip />
 
-用于把 Model 中的 State 作为局部状态使用，效果类似 React 的 `useState`。`useLocalModel` API 形式上与 `useModel` 完全一致。具体使用请参考 [`useModel`](./use-model.md)。
+用于把 Model 中的 State 作为局部状态使用，效果类似 React 的 `useState`。`useLocalModel` API 形式上与 `useModel` 完全一致。具体使用请参考 [`useModel`](./use-model.mdx)。
 
 #### 示例
 

package/zh/apis/app/runtime/model/use-static-model.mdx

@@ -8,7 +8,7 @@ import ReduckTip from "@site-docs/components/reduck-tip"
 
 <ReduckTip />
 
-如果想在组件里以 React Hook 的形式消费某个 Model，并能随时获取到当前最新的状态，但又不希望 Model 状态更新的时候，引起组件的重新渲染，可以使用 `useStaticModel`。`useStaticModel` API 形式上与 `useModel` 完全一致。具体使用请参考 [`useModel`](./use-model.md)。
+如果想在组件里以 React Hook 的形式消费某个 Model，并能随时获取到当前最新的状态，但又不希望 Model 状态更新的时候，引起组件的重新渲染，可以使用 `useStaticModel`。`useStaticModel` API 形式上与 `useModel` 完全一致。具体使用请参考 [`useModel`](./use-model.mdx)。
 
 为了保证总是能获取到最新状态，注意不要对返回的 `state` 解构。
 

package/zh/apis/app/runtime/model/use-store.mdx

@@ -18,7 +18,7 @@ function useStore(): ReduckStore;
 
 ### 返回值
 
-- ReduckStore：Reduck Store，类型参考 [createStore](./create-store.md) 返回值。
+- ReduckStore：Reduck Store，类型参考 [createStore](./create-store.mdx) 返回值。
 
 :::info 更多参考
 [使用 Model](/guides/topic-detail/model/use-model#在组件外使用)

package/zh/apis/app/runtime/testing/renderApp.mdx

@@ -15,7 +15,7 @@ import { renderApp } from '@modern-js/runtime/testing';
 
 ## 函数签名
 
-`renderApp` 和 [render](./render.md) 完全一致。
+`renderApp` 和 [render](./render.mdx) 完全一致。
 
 ## 示例
 

package/zh/components/custom-router-micro-frontend.mdx

@@ -0,0 +1,40 @@
+```js title="src/App.tsx"
+import { useModuleApps } from '@modern-js/plugin-garfish/runtime';
+
+import { RouterProvider, Route, createBrowserRouter, createRoutesFromElements, BrowserRouter, Link, Outlet } from '@modern-js/runtime/router';
+
+const AppLayout = () => (
+  <>
+    <div><Link to={'/table'}>加载约定式路由子应用</Link></div>
+    <div><Link to={'/dashboard'}>加载自控式路由子应用</Link></div>
+    <div><Link to={'/'}>卸载子应用</Link></div>
+    <Outlet />
+  </>
+)
+
+export default () => {
+  const { apps, MApp, Table, Dashboard } = useModuleApps();
+
+  // 使用的不是 MApp 组件，需要使用 createBrowserRouter 来创建路由
+  const router = createBrowserRouter(
+    createRoutesFromElements(
+      <Route path="/" element={<AppLayout />}>
+        <Route key={'table'} path={'table/*'} element={<Table />} />
+        <Route key={'dashboard'} path={'dashboard/*'} element={<Dashboard />} />
+      </Route>
+    )
+  );
+
+  return (
+    // 方法一：使用 MApp 自动根据配置的 activeWhen 参数加载子应用(本项目配置在 modern.config.ts 中)
+    // <BrowserRouter>
+    //   <MApp />
+    // </BrowserRouter>
+
+    // 方法二：手动写 Route 组件方式加载子应用，方便于需要鉴权等需要前置操作的场景
+    <>
+      <RouterProvider router={router} />
+    </>
+  );
+};
+```

package/zh/components/enable-micro-frontend.mdx

@@ -5,9 +5,19 @@ import garfishPlugin from '@modern-js/plugin-garfish';
 export default defineConfig({
   runtime: {
     router: true,
-    state: true,
-    masterApp: true,
+    masterApp: {
+      apps: [{
+        name: 'Table',
+        entry: 'http://localhost:8081',
+        // activeWhen: '/table'
+      }, {
+        name: 'Dashboard',
+        entry: 'http://localhost:8082'
+        // activeWhen: '/dashboard'
+      }]
+    },
   },
   plugins: [appTools(), garfishPlugin()],
 });
+
 ```

package/zh/components/micro-runtime-config.mdx

@@ -3,16 +3,15 @@ import { defineConfig } from '@modern-js/runtime';
 
 defineConfig(App, {
   masterApp: {
-    apps: [
-      {
-        name: 'DashBoard',
-        entry: 'http://127.0.0.1:8081/',
-      },
-      {
-        name: 'TableList',
-        entry: 'http://localhost:8082',
-      },
-    ],
+    apps: [{
+      name: 'Table',
+      entry: 'http://localhost:8001',
+      // activeWhen: '/table'
+    }, {
+      name: 'Dashboard',
+      entry: 'http://localhost:8002'
+      // activeWhen: '/dashboard'
+    }]
   },
 });
 ```

package/zh/components/release-note.mdx

@@ -1 +1 @@
-根据官网 [Release Note](https://github.com/modern-js-dev/modern.js/releases/tag/v1.22.1)，开发者也可以手动将项目升级到想要的版本。
+根据官网 [Release Note](https://github.com/modern-js-dev/modern.js/releases)，开发者也可以手动将项目升级到想要的版本。

package/zh/configure/app/builder-plugins.mdx

@@ -9,7 +9,7 @@ sidebar_position: 10
 
 用于配置 Modern.js Builder 构建插件。
 
-Modern.js Builder 是 Modern.js 底层的构建引擎，请阅读 [构建能力](/guides/basic-features/builder) 了解相关背景。
+Modern.js Builder 是 Modern.js 底层的构建引擎，请阅读 [构建能力](/guides/concept/builder) 了解相关背景。
 
 如果你想了解 Builder 插件的编写方式，可以参考 [Modern.js Builder - 插件系统](https://modernjs.dev/builder/plugins/introduction.html)。
 
@@ -17,13 +17,13 @@ Modern.js Builder 是 Modern.js 底层的构建引擎，请阅读 [构建能力]
 
 该选项**用于配置 Modern.js Builder 构建插件**，如果你需要配置其他类型的插件，请选择对应的配置方式：
 
-- 配置 Modern.js 框架插件，请使用 [plugins](docs/configure/app/plugins) 配置项。
+- 配置 Modern.js 框架插件，请使用 [plugins](/configure/app/plugins) 配置项。
 - 配置 webpack 插件，请使用 [tools.webpack](/configure/app/tools/webpack) 或 [tools.webpackChain](/configure/app/tools/webpack-chain) 配置项。
 - 配置 Babel 插件，请使用 [tools.babel](/configure/app/tools/babel) 配置项。
 
 ## 何时使用
 
-大部分场景下，我们推荐你使用 Modern.js 框架插件，框架插件可以通过 [plugins](docs/configure/app/plugins) 字段进行注册。因为框架插件提供的 API 更丰富、能力更强，而 Builder 插件提供的 API 只能用于构建场景。
+大部分场景下，我们推荐你使用 Modern.js 框架插件，框架插件可以通过 [plugins](/configure/app/plugins) 字段进行注册。因为框架插件提供的 API 更丰富、能力更强，而 Builder 插件提供的 API 只能用于构建场景。
 
 当你需要引用一些现有的 Builder 插件（并且在 Modern.js 中没有相关能力），或是在不同的框架之间复用 Builder 插件时，你可以使用 `builderPlugins` 字段进行注册。
 

package/zh/configure/app/dev/asset-prefix.mdx

@@ -5,7 +5,7 @@ sidebar_label: assetPrefix
 # dev.assetPrefix
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [dev.assetPrefix](https://modernjs.dev/builder/api/config-dev.html#dev-assetprefix)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [dev.assetPrefix](https://modernjs.dev/builder/api/config-dev.html#devassetprefix)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/dev/assetPrefix.md'

package/zh/configure/app/dev/hmr.mdx

@@ -5,7 +5,7 @@ sidebar_label: hmr
 # dev.hmr
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [dev.hmr](https://modernjs.dev/builder/api/config-dev.html#dev-hmr)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [dev.hmr](https://modernjs.dev/builder/api/config-dev.html#devhmr)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/dev/hmr.md'

package/zh/configure/app/dev/https.mdx

@@ -5,7 +5,7 @@ sidebar_label: https
 # dev.https
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [dev.https](https://modernjs.dev/builder/api/config-dev.html#dev-https)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [dev.https](https://modernjs.dev/builder/api/config-dev.html#devhttps)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/dev/https.md'

package/zh/configure/app/dev/port.mdx

@@ -5,7 +5,7 @@ sidebar_label: port
 # dev.port
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [dev.port](https://modernjs.dev/builder/api/config-dev.html#dev-port)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [dev.port](https://modernjs.dev/builder/api/config-dev.html#devport)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/dev/port.md'

package/zh/configure/app/dev/progress-bar.mdx

@@ -5,7 +5,7 @@ sidebar_label: progressBar
 # dev.progressBar
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [dev.progressBar](https://modernjs.dev/builder/api/config-dev.html#dev-progressbar)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [dev.progressBar](https://modernjs.dev/builder/api/config-dev.html#devprogressbar)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/dev/progressBar.md'

package/zh/configure/app/dev/start-url.mdx

@@ -5,7 +5,7 @@ sidebar_label: startUrl
 # dev.startUrl
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [dev.startUrl](https://modernjs.dev/builder/api/config-dev.html#dev-starturl)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [dev.startUrl](https://modernjs.dev/builder/api/config-dev.html#devstarturl)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/dev/startUrl.md'

package/zh/configure/app/experiments/lazy-compilation.mdx

@@ -5,7 +5,7 @@ sidebar_label: lazyCompilation
 # experiments.lazyCompilation
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [experiments.lazyCompilation](https://modernjs.dev/builder/api/config-experiments.html#experiments-lazycompilation)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [experiments.lazyCompilation](https://modernjs.dev/builder/api/config-experiments.html#experimentslazycompilation)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/experiments/lazyCompilation.md'

package/zh/configure/app/html/app-icon.mdx

@@ -5,7 +5,7 @@ sidebar_label: appIcon
 # html.appIcon
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.appIcon](https://modernjs.dev/builder/api/config-html.html#html-appicon)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.appIcon](https://modernjs.dev/builder/api/config-html.html#htmlappicon)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/appIcon.md'

package/zh/configure/app/html/crossorigin.mdx

@@ -5,7 +5,7 @@ sidebar_label: crossorigin
 # html.crossorigin
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.crossorigin](https://modernjs.dev/builder/api/config-html.html#html-crossorigin)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.crossorigin](https://modernjs.dev/builder/api/config-html.html#htmlcrossorigin)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/crossorigin.md'

package/zh/configure/app/html/disable-html-folder.mdx

@@ -5,7 +5,7 @@ sidebar_label: disableHtmlFolder
 # html.disableHtmlFolder
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.disableHtmlFolder](https://modernjs.dev/builder/api/config-html.html#html-disablehtmlfolder)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.disableHtmlFolder](https://modernjs.dev/builder/api/config-html.html#htmldisablehtmlfolder)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/disableHtmlFolder.md'

package/zh/configure/app/html/favicon-by-entries.mdx

@@ -5,7 +5,7 @@ sidebar_label: faviconByEntries
 # html.faviconByEntries
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.faviconByEntries](https://modernjs.dev/builder/api/config-html.html#html-faviconbyentries)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.faviconByEntries](https://modernjs.dev/builder/api/config-html.html#htmlfaviconbyentries)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/faviconByEntries.md'

package/zh/configure/app/html/favicon.mdx

@@ -5,7 +5,7 @@ sidebar_label: favicon
 # html.favicon
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.favicon](https://modernjs.dev/builder/api/config-html.html#html-favicon)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.favicon](https://modernjs.dev/builder/api/config-html.html#htmlfavicon)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/favicon.md'

package/zh/configure/app/html/inject-by-entries.mdx

@@ -5,7 +5,7 @@ sidebar_label: injectByEntries
 # html.injectByEntries
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.injectByEntries](https://modernjs.dev/builder/api/config-html.html#html-injectbyentries)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.injectByEntries](https://modernjs.dev/builder/api/config-html.html#htmlinjectbyentries)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/injectByEntries.md'

package/zh/configure/app/html/inject.mdx

@@ -5,7 +5,7 @@ sidebar_label: inject
 # html.inject
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.inject](https://modernjs.dev/builder/api/config-html.html#html-inject)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.inject](https://modernjs.dev/builder/api/config-html.html#htmlinject)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/inject.md'

package/zh/configure/app/html/meta-by-entries.mdx

@@ -5,7 +5,7 @@ sidebar_label: metaByEntries
 # html.metaByEntries
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.metaByEntries](https://modernjs.dev/builder/api/config-html.html#html-metabyentries)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.metaByEntries](https://modernjs.dev/builder/api/config-html.html#htmlmetabyentries)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/metaByEntries.md'

package/zh/configure/app/html/meta.mdx

@@ -5,7 +5,7 @@ sidebar_label: meta
 # html.meta
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.meta](https://modernjs.dev/builder/api/config-html.html#html-meta)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.meta](https://modernjs.dev/builder/api/config-html.html#htmlmeta)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/meta.md'

package/zh/configure/app/html/mount-id.mdx

@@ -5,7 +5,7 @@ sidebar_label: mountId
 # html.mountId
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.mountId](https://modernjs.dev/builder/api/config-html.html#html-mountid)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.mountId](https://modernjs.dev/builder/api/config-html.html#htmlmountid)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/mountId.md'

package/zh/configure/app/html/tags-by-entries.mdx

@@ -5,7 +5,7 @@ sidebar_label: tagsByEntries
 # html.tagsByEntries
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.tagsByEntries](https://modernjs.dev/builder/api/config-html.html#html-tagsbyentries)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.tagsByEntries](https://modernjs.dev/builder/api/config-html.html#htmltagsbyentries)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/tagsByEntries.md'

package/zh/configure/app/html/tags.mdx

@@ -5,7 +5,7 @@ sidebar_label: tags
 # html.tags
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.tags](https://modernjs.dev/builder/api/config-html.html#html-tags)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.tags](https://modernjs.dev/builder/api/config-html.html#htmltags)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/tags.md'

package/zh/configure/app/html/template-by-entries.mdx

@@ -5,7 +5,7 @@ sidebar_label: templateByEntries
 # html.templateByEntries
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.templateByEntries](https://modernjs.dev/builder/api/config-html.html#html-templatebyentries)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.templateByEntries](https://modernjs.dev/builder/api/config-html.html#htmltemplatebyentries)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/templateByEntries.md'

package/zh/configure/app/html/template-parameters-by-entries.mdx

@@ -5,7 +5,7 @@ sidebar_label: templateParametersByEntries
 # html.templateParametersByEntries
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.templateParametersByEntries](https://modernjs.dev/builder/api/config-html.html#html-templateparametersbyentries)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.templateParametersByEntries](https://modernjs.dev/builder/api/config-html.html#htmltemplateparametersbyentries)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/templateParametersByEntries.md'

package/zh/configure/app/html/template-parameters.mdx

@@ -5,7 +5,7 @@ sidebar_label: templateParameters
 # html.templateParameters
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.templateParameters](https://modernjs.dev/builder/api/config-html.html#html-templateparameters)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.templateParameters](https://modernjs.dev/builder/api/config-html.html#htmltemplateparameters)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/templateParameters.md'

package/zh/configure/app/html/template.mdx

@@ -5,7 +5,7 @@ sidebar_label: template
 # html.template
 
 :::tip
-该配置由 Modern.js Builder 提供，更多信息可参考 [html.template](https://modernjs.dev/builder/api/config-html.html#html-template)。
+该配置由 Modern.js Builder 提供，更多信息可参考 [html.template](https://modernjs.dev/builder/api/config-html.html#htmltemplate)。
 :::
 
 import Main from '@modern-js/builder-doc/docs/zh/config/html/template.md'