@modern-js/main-doc 2.4.0 → 2.6.0

package/.turbo/turbo-build.log

@@ -1,4 +1,4 @@
 
-> @modern-js/main-doc@2.4.0 build /github/workspace/packages/toolkit/main-doc
+> @modern-js/main-doc@2.6.0 build /github/workspace/packages/toolkit/main-doc
 > npx ts-node ./scripts/sync.ts
 

package/LICENSE

@@ -19,126 +19,3 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
-
-
-The code implementation modified from external library  are:
-
-- vite
-
-    MIT License
-
-    Copyright (c) 2019-present, Yuxi (Evan) You and Vite contributors
-
-    Permission is hereby granted, free of charge, to any person obtaining a copy
-    of this software and associated documentation files (the "Software"), to deal
-    in the Software without restriction, including without limitation the rights
-    to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-    copies of the Software, and to permit persons to whom the Software is
-    furnished to do so, subject to the following conditions:
-
-    The above copyright notice and this permission notice shall be included in all
-    copies or substantial portions of the Software.
-
-    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-    IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-    FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-    AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-    LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-    SOFTWARE.
-
-- wmr
-
-    MIT License
-
-    Copyright (c) 2020 The Preact Authors
-
-    Permission is hereby granted, free of charge, to any person obtaining a copy
-    of this software and associated documentation files (the "Software"), to deal
-    in the Software without restriction, including without limitation the rights
-    to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-    copies of the Software, and to permit persons to whom the Software is
-    furnished to do so, subject to the following conditions:
-
-    The above copyright notice and this permission notice shall be included in all
-    copies or substantial portions of the Software.
-
-    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-    IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-    FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-    AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-    LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-    SOFTWARE.
-
-- bundle-require
-
-    The MIT License (MIT)
-
-    Copyright © 2021 EGOIST (https://github.com/sponsors/egoist)
-
-    Permission is hereby granted, free of charge, to any person obtaining a copy
-    of this software and associated documentation files (the "Software"), to deal
-    in the Software without restriction, including without limitation the rights
-    to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-    copies of the Software, and to permit persons to whom the Software is
-    furnished to do so, subject to the following conditions:
-
-    The above copyright notice and this permission notice shall be included in all
-    copies or substantial portions of the Software.
-
-    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-    IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-    FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-    AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-    LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-    SOFTWARE
-
-- react-dev-utils
-
-    MIT License
-
-    Copyright (c) 2013-present, Facebook, Inc.
-
-    Permission is hereby granted, free of charge, to any person obtaining a copy
-    of this software and associated documentation files (the "Software"), to deal
-    in the Software without restriction, including without limitation the rights
-    to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-    copies of the Software, and to permit persons to whom the Software is
-    furnished to do so, subject to the following conditions:
-
-    The above copyright notice and this permission notice shall be included in all
-    copies or substantial portions of the Software.
-
-    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-    IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-    FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-    AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-    LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-    SOFTWARE.
-
-- jest-cli
-
-    MIT License
-
-    Copyright (c) Facebook, Inc. and its affiliates.
-
-    Permission is hereby granted, free of charge, to any person obtaining a copy
-    of this software and associated documentation files (the "Software"), to deal
-    in the Software without restriction, including without limitation the rights
-    to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-    copies of the Software, and to permit persons to whom the Software is
-    furnished to do so, subject to the following conditions:
-
-    The above copyright notice and this permission notice shall be included in all
-    copies or substantial portions of the Software.
-
-    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-    IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-    FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-    AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-    LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-    SOFTWARE.

package/README.md

@@ -0,0 +1,26 @@
+<p align="center">
+  <a href="https://modernjs.dev" target="blank"><img src="https://lf3-static.bytednsdoc.com/obj/eden-cn/ylaelkeh7nuhfnuhf/modernjs-cover.png" width="300" alt="Modern.js Logo" /></a>
+</p>
+
+<h1 align="center">Modern.js</h1>
+
+<p align="center">
+  A Progressive React Framework for modern web development.
+</p>
+
+## Getting Started
+
+Please follow [Quick Start](https://modernjs.dev/en/guides/get-started/quick-start) to get started with Modern.js.
+
+## Documentation
+
+- [English Documentation](https://modernjs.dev/en/)
+- [中文文档](https://modernjs.dev)
+
+## Contributing
+
+Please read the [Contributing Guide](https://github.com/modern-js-dev/modern.js/blob/main/CONTRIBUTING.md).
+
+## License
+
+Modern.js is [MIT licensed](https://github.com/modern-js-dev/modern.js/blob/main/LICENSE).

package/en/apis/app/commands.mdx

@@ -0,0 +1,297 @@
+---
+sidebar_position: 1
+---
+
+# Commands
+
+Modern.js has some built-in commands that can help you quickly start a development server, build production environment code, and more.
+
+Through this chapter, you can learn about the built-in commands of Modern.js and how to use them.
+
+## modern dev
+
+The `modern dev` command is used to start a local development server and compile the source code in the development environment.
+
+```bash
+Usage: modern dev [options]
+
+Options:
+  -e --entry <entry>    compiler by entry
+  -c --config <config>  configuration file path, which can be a relative path or an absolute path
+  -h, --help            show command help
+  --analyze             analyze the bundle and view size of each module
+  --api-only            only start API service
+```
+
+After running `modern dev`, Modern.js will watch source file changes and apply hot module replacement.
+
+```bash
+$ modern dev
+
+info    Starting dev server...
+info    App running at:
+
+  > Local:    http://localhost:8080/
+  > Network:  http://192.168.0.1:8080/
+```
+
+### Compile Partial Pages
+
+In multi-page (MPA) projects, the `--entry` option can be added to specify one or more pages to compile. In this way, only part of the code in the project will be compiled, and the dev startup speed will be faster.
+
+For example, execute `modern dev --entry`, the entry selector will be displayed in the command line interface:
+
+```bash
+$ modern dev --entry
+
+? Please select the entry that needs to be built
+❯ ◯ foo
+  ◯ bar
+  ◯ baz
+```
+
+For example, if you select the `foo` entry, only the code related to the `foo` entry will be compiled, and the code of other pages will not be compiled.
+
+### Specify the page by parameter
+
+You can also specify the page name through parameters after `--entry`, and the names of multiple pages can be separated by commas.
+
+```bash
+# Compile foo page
+modern dev --entry foo
+
+# Compile foo and bar pages
+modern dev --entry foo,bar
+```
+
+## modern start
+
+`modern start` is an alias of `modern dev` command, the usage of the two are exactly the same.
+
+## modern build
+
+The `modern build` command will build a production-ready product in the `dist/` directory by default. You can specify the output directory by modifying the configuration [`output.distPath`](/configure/app/output/dist-path).
+
+```bash
+Usage: modern build [options]
+
+Options:
+  -c --config <config>  configuration file path, which can be a relative path or an absolute path
+  -h, --help            show command help
+  --analyze             analyze the bundle and view size of each module
+```
+
+### Analyze Bundle
+
+execute `npx modern build --analyze` command，can produce an HTML file that analyzes the volume of the bundle while packaging the production code:
+
+```
+Bundle Analyzer saved report to /example/dist/report.html
+File sizes after production build:
+
+  122.35 KB  dist/static/js/885.1d4fbe5a.js
+  2.3 KB     dist/static/js/main.4b8e8d64.js
+  761 B      dist/static/js/runtime-main.edb7cf35.js
+  645 B      dist/static/css/main.0dd3ecc1.css
+```
+
+Open the above HTML file in the browser, you can see the tile diagram of the packaged product, and perform package volume analysis and optimization:
+
+<img src="https://lf3-static.bytednsdoc.com/obj/eden-cn/aphqeh7uhohpquloj/modern-js/mwa-build-analyze-8784f762c1ab0cb20935829d5f912c4c.png" />
+
+> this features based on [webpack-bundle-analyzer](https://github.com/webpack-contrib/webpack-bundle-analyzer).
+
+## modern new
+
+The `modern new` command is used to enable features in an existing project.
+
+For example, add application entry, enable some optional features such as Tailwind CSS, micro frontend, etc.
+
+```bash
+Usage: modern new [options]
+
+Options:
+  -d, --debug            using debug mode to log something (default: false)
+  -c, --config <config>  set default generator config(json string)
+  --dist-tag <tag>       use specified tag version for its generator
+  --registry             set npm registry url to run npm command
+  -h, --help             show command help
+```
+
+### Add Entry
+
+In the project, execute the `new` command to add entries as follows:
+
+```bash
+$ npx modern new
+? Action Create project element
+? Create project element New "entry"
+? Entry name entry
+```
+
+### Enable Features
+
+In the project, execute the `new` command to enable features as follows:
+
+```bash
+$ npx modern new
+? Action Enable features
+? Enable features (Use arrow keys)
+❯ Enable Tailwind CSS
+  Enable BFF
+  Enable SSG
+  Enable Micro Frontend
+  Enable Unit Test / Integration Test
+  Enable Visual Testing (Storybook)
+```
+
+:::tip
+The `--config` parameter needs to use a JSON string.
+
+pnpm does not support the use of JSON strings as parameter values currently. Use `npm new` to turn on.【[Relate Issue](https://github.com/pnpm/pnpm/issues/3876)】
+:::
+
+## modern serve
+
+Usually use the `modern serve` command to enable project run in the production environment, and you need to execute the [`build'](/apis/app/commands#modern-build) command in advance to build the outputs.
+
+```bash
+Usage: modern serve [options]
+
+Options:
+  -c --config <config>  configuration file path, which can be a relative path or an absolute path
+  -h, --help            show command help
+  --api-only            only run API service
+```
+
+By default, the project will run in `localhost:8080`, you can modify the Server port number with `server.port`:
+
+```js
+export default defineConfig({
+  server: {
+    port: 8081,
+  },
+});
+```
+
+## modern upgrade
+
+Execute the command `npx modern upgrade` in the project, by default, dependencies in the `package.json` are updated to the latest version.
+
+```
+Usage: modern upgrade [options]
+
+Options:
+  --registry <registry>  specify npm registry (default: "")
+  -d,--debug             using debug mode to log something (default: false)
+  --cwd <cwd>            app directory (default: "")
+  -h, --help             show command help
+```
+
+## modern inspect
+
+The `modern inspect` command is used to view the [Modern.js Builder config](https://modernjs.dev/builder/en/guide/basic/builder-config.html) and webpack config of the project.
+
+```
+Usage: modern inspect [options]
+
+Options:
+  --env <env>           view the configuration in the target environment (default: "development")
+  --output <output>     Specify the path to output in the dist (default: "/")
+  --verbose             Show the full function in the result
+  -c --config <config>  configuration file path, which can be a relative path or an absolute path
+  -h, --help            show command help
+```
+
+After executing the command `npx modern inspect` in the project root directory, the following files will be generated in the `dist` directory of the project:
+
+- `builder.config.js`: The Modern.js Builder config to use at build time.
+- `webpack.config.web.js`: The webpack config used by to use at build time.
+
+```bash
+➜ npx modern inspect
+
+Inspect config succeed, open following files to view the content:
+
+  - Builder Config: /root/my-project/dist/builder.config.js
+  - Webpack Config (web): /root/my-project/dist/webpack.config.web.js
+```
+
+### Configuration Env
+
+By default, the inspect command will output the development configs, you can use the `--env production` option to output the production configs:
+
+```bash
+modern inspect --env production
+```
+
+### Verbose content
+
+By default, the inspect command will omit the function content in the config object, you can use the `--verbose` option to output the full content of the function:
+
+```bash
+modern inspect --verbose
+```
+
+### SSR Configuration
+
+If the project has enabled SSR, an additional `webpack.config.node.js` file will be generated in the `dist/`, corresponding to the webpack configuration at SSR build time.
+
+```bash
+➜ npx modern inspect
+
+Inspect config succeed, open following files to view the content:
+
+  - Builder Config: /root/my-project/dist/builder.config.js
+  - Webpack Config (web): /root/my-project/dist/webpack.config.web.js
+  - Webpack Config (node): /root/my-project/dist/webpack.config.node.js
+```
+
+## modern lint
+
+Run ESLint to check the syntax of the code.
+
+```bash
+Usage: modern lint [options] [...files]
+
+Options:
+  --no-fix    disable auto fix source file
+  -h, --help  display help for command
+```
+
+Normally, only the part of the code modified by this commit needs to be checked by `lint-staged` during the `git commit` phase.
+
+- `--no-fix` close auto fix by lint.
+
+## modern test
+
+`modern test` command will automatically run the test cases.
+
+```bash
+Usage: modern test [options]
+
+Options:
+  -h, --help  show command help
+```
+
+:::tip
+`modern test` command need to execute the `new` command in advance to enable the `unit test/integration test`.
+:::
+
+The effect is as follows:
+
+```bash
+$ npx modern test
+ PASS  src/tests/index.test.ts
+  The add method
+    ✓ should work fine. (2ms)
+
+Test Suites: 1 passed, 1 total
+Tests:       1 passed, 1 total
+Snapshots:   0 total
+Time:        0.994 s, estimated 1 s
+```
+
+:::info
+Files match `*.test.(js|ts)` in `api/` or `src/` folders will be recognized as test cases by default.
+:::

package/en/apis/app/hooks/_category_.json

@@ -1,8 +1,5 @@
 {
   "label": "Convention",
-  "position": 1,
-  "link": {
-    "type": "doc",
-    "id": "apis/app/hooks/index"
-  }
+  "position": 2,
+  "collapsed": false
 }

package/en/apis/app/hooks/api/framework/lambda.mdx

@@ -40,7 +40,7 @@ Dynamic named routing parameters can be supported by creating folders or files w
 - `api/lambda/user/[username]/delete.ts` -> `$BASENAME/user/:username/delete`
 - `api/lambda/article/[id]/info.ts` -> `$BASENAME/article/:id/info`
 
-the `$BASENAME` can be configured in `modern.config.js`，the default value is `/api`。
+the `$BASENAME` can be configured in `modern.config.js`，the default value is `/api`.
 
 ### Allow List
 

package/en/apis/app/hooks/api/functions/api.mdx

@@ -40,7 +40,7 @@ Dynamic named routing parameters can be supported by creating folders or files w
 - `api/user/[username]/delete.ts` -> `$BASENAME/user/:username/delete`
 - `api/article/[id]/info.ts` -> `$BASENAME/article/:id/info`
 
-the `$BASENAME` can be configured in `modern.config.js`，the default value is `/api`。
+the `$BASENAME` can be configured in `modern.config.js`，the default value is `/api`.
 
 ### Allow List
 

package/en/apis/app/hooks/server/index_.mdx

@@ -2,6 +2,7 @@
 title: index.[tj]s
 sidebar_position: 1
 ---
+
 # index.[tj]s
 
 A file that extends the Modern.js Web Server, to add a Hook or Middleware to the Web Server that the project uses.
@@ -11,6 +12,6 @@ It can intercept requests and responses, authenticate and role, request preproce
 It can also be inserted logic into the built-in processing handler (including route matching, resource addressing, header injection, page rendering, static web hosting).
 
 :::info
-For detail, see [Hook](/apis/app/runtime/web-server/hook) & [Middleware](/apis/app/runtime/web-server/middleware)。
+For detail, see [Hook](/apis/app/runtime/web-server/hook) & [Middleware](/apis/app/runtime/web-server/middleware).
 
 :::

package/en/apis/app/hooks/src/pages.mdx

@@ -107,16 +107,16 @@ For example the following directory structure:
     └── index.js
 ```
 
-- access `/`, the `Component` is `pages/index.js`。
-- access `/a`, the `Component` is `pages/a/index.js`。
-- access `/a/b`, the `Component` is `pages/a/b/index.js`。
+- access `/`, the `Component` is `pages/index.js`.
+- access `/a`, the `Component` is `pages/a/index.js`.
+- access `/a/b`, the `Component` is `pages/a/b/index.js`.
 
 :::tip Advantages
 
 - preserve the state of the global layout when the page changes.
 - add global css.
 - handle ComponentDidCatch error
-- use `defineConfig`(/docs/apis/app/runtime/app/define-config) dynamic configuration runtime.
+- use [defineConfig](/apis/app/runtime/app/define-config) dynamic configuration runtime.
 
 :::
 
@@ -149,8 +149,8 @@ export default ALayout;
 
 The Component props is the specific route, for example
 
-- access `/a`, the `Component` is `pages/a/index.js`。
-- 访问 `/a/b`, the `Component` is `pages/a/b/index.js`。
+- access `/a`, the `Component` is `pages/a/index.js`.
+- 访问 `/a/b`, the `Component` is `pages/a/b/index.js`.
 
 In this way, you can use `pages/a/_layout.js` to display the routing common layout in the `a` directory.
 
@@ -179,4 +179,4 @@ the generated route is configured is as:
 ]
 ```
 
-All unmatched routes will match to `pages/404.[tj]s`。
+All unmatched routes will match to `pages/404.[tj]s`.

package/en/apis/app/hooks/src/routes.mdx

@@ -44,15 +44,15 @@ If the directory name of the route file is named with `[]`, the generated route
 ```
 └── routes
     ├── [id]
-    │   └── page.tsx
+    │   └── page.tsx
     ├── blog
-    │   └── page.tsx
+    │   └── page.tsx
     └── page.tsx
 ```
 
 The `routes/[id]/page.tsx` file will be converted to a `/:id` route. All `/xxx` will match that route, except for the `/blog` route, which can be matched exactly.
 
-In the component, you can get the corresponding parameters by [useParams](/apis/app/runtime/router/#useparams).
+In the component, you can get the corresponding parameters by [useParams](/apis/app/runtime/router/router#useparams).
 
 In the loader, params will be used as input to [loader](/guides/basic-features/data-fetch#loader-function), and the corresponding parameters can be retrieved through the property `params`.
 

package/en/apis/app/runtime/_category_.json

@@ -1,9 +1,5 @@
 {
   "label": "runtime",
   "position": 3,
-  "collapsed": false,
-  "link": {
-    "type": "doc",
-    "id": "apis/app/runtime/index"
-  }
+  "collapsed": false
 }

package/en/apis/app/runtime/app/define-config.mdx

@@ -28,8 +28,8 @@ function defineConfig(Component, config): any;
 
 ### Input
 
-- Component: App root Component。
-- config: runtime config。
+- Component: App root Component.
+- config: runtime config.
 
 ## Example
 

package/en/apis/app/runtime/core/bootstrap.mdx

@@ -3,7 +3,7 @@ title: bootstrap
 ---
 # bootstrap
 
-Used to start and mount App, usually without manual calls。This API is only required when using [Custom App](/guides/concept/entries#自定义-app).
+Used to start and mount App, usually without manual calls. This API is only required when using [Custom App](/guides/concept/entries#自定义-app).
 
 ## Usage
 

package/en/apis/app/runtime/core/create-app.mdx

@@ -3,7 +3,7 @@ title: createApp
 ---
 # createApp
 
-Used to create custom entries, custom runtime plugins. This API is only required when using [Custom App](/guides/concept/entries#自定义-app).
+Used to create custom entries, custom runtime plugins. This API is only required when using [Custom App](/guides/concept/entries#app).
 
 ## Usage
 
@@ -28,7 +28,7 @@ function createApp(options: { plugins: Plugin[] }): React.ComponentType<any>;
 
 ### Create Custom Entry
 
-For details, see [`bootstrap`](./bootstrap.md)。
+For details, see [`bootstrap`](./bootstrap.mdx).
 
 ### Custom Plugins
 

package/en/apis/app/runtime/core/use-loader.mdx

@@ -3,7 +3,7 @@ title: useLoader
 ---
 # useLoader
 
-Isomorphic API，usually used to make asynchronous requests。When SSR, the server level uses `useLoader` to prefetch the data, and the browser side also reuses this part of the data.
+Isomorphic API，usually used to make asynchronous requests. When SSR, the server level uses `useLoader` to prefetch the data, and the browser side also reuses this part of the data.
 
 ## Usage
 
@@ -35,7 +35,7 @@ function useLoader(loaderFn: LoaderFn, options: Options): ReturnData;
 ```
 
 :::info
-`runtimeContext` can refer to [useRuntimeContext](/apis/app/runtime/core/use-runtime-context)。
+`runtimeContext` can refer to [useRuntimeContext](/apis/app/runtime/core/use-runtime-context).
 
 :::
 
@@ -47,14 +47,14 @@ function useLoader(loaderFn: LoaderFn, options: Options): ReturnData;
   - `onError`: error callback.
   - `initialData`: the initial data before the first execution,.
   - `skip`: when the value is `true`, the function does not execute.
-  - `params`: when the result of the `params` serialization changes，the function is re-executed。`params` is also passed in as the second argument of the function.
+  - `params`: when the result of the `params` serialization changes，the function is re-executed. `params` is also passed in as the second argument of the function.
   - `static`: when the value is `true`, `useLoader` is used for [SSG](/guides/advanced-features/ssg).
 
 ### Return Value
 
 - `data`: return data on successful execution.
 - `loading`: indicates whether the function is in execution.
-- `error`: error message when function execution fails。
+- `error`: error message when function execution fails.
 - `reload`: the function can be re-executed after the call.
   - `params`: when the value is `undefined`, the last value will be reused; otherwise, the function will be re-executed with the new value.
 - `reloading`: during the execution of the call to `reload`, the value of `reloading` is `true`.

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

@@ -46,7 +46,7 @@ defineConfig(App, {
   masterApp: {
     apps: [
       {
-        // name 区分大小写，name 提供的是什么 useModuleApps 返回的就是什么
+        // name is case-sensitive, what name provides is what useModuleApps returns
         name: 'Home',
         entry: 'http://127.0.0.1:8081/',
       },
@@ -63,7 +63,7 @@ Get the `Home` and `Contact` sub-application components(the same as name in the
 
 ### Centralized Routing
 
-**Centralized Routing** is a way to centrally configure the activation routes of sub-applications. Add `activeWhen` config to enable **Centralized Routing**。
+**Centralized Routing** is a way to centrally configure the activation routes of sub-applications. Add `activeWhen` config to enable **Centralized Routing**.
 
 import MicroRuntimeConfig from "@site-docs-en/components/micro-runtime-config";