@modern-js/main-doc 0.0.0-next-1680856068325 → 0.0.0-next-1680876402799

package/docs/zh/guides/basic-features/routes.mdx

@@ -2,6 +2,7 @@
 title: 路由
 sidebar_position: 1
 ---
+
 # 路由
 
 Modern.js 的路由基于 [React Router 6](https://reactrouter.com/en/main)，并提供了多种类型的路由模式。根据不同 [入口](/guides/concept/entries) 类型，将路由分为三种模式，分别是**约定式路由**，**自控式路由**和**其他路由方案**。
@@ -77,8 +78,8 @@ Modern.js 支持了业界流行的约定式路由模式：**嵌套路由**，使
 ```tsx
 <Layout>
   <UserLayout>
-    <UserPage>
-  <UserLayout>
+    <UserPage />
+  </UserLayout>
 </Layout>
 ```
 
@@ -138,8 +139,8 @@ export default () => {
 ```tsx
 <Layout>
   <UserLayout>
-    <UserPage>
-  <UserLayout>
+    <UserPage />
+  </UserLayout>
 </Layout>
 ```
 
@@ -177,6 +178,7 @@ export default () => {
 :::
 
 例如以下目录结构：
+
 ```
 └── routes
     ├── $.tsx
@@ -186,11 +188,12 @@ export default () => {
 ```
 
 当访问任何匹配不到的路径时，都会渲染 `routes/$.tsx` 组件，同样，`$.tsx` 中可以使用 [useParams](/apis/app/runtime/router/router#useparams) 捕获 url 的剩余部分。
+
 ```ts title="$.tsx"
 import { useParams } from '@modern-js/runtime/router';
 // 当 path 是 `/aaa/bbb` 时
 const params = useParams();
-params['*']  // => 'aaa/bbb'
+params['*']; // => 'aaa/bbb'
 ```
 
 `$.tsx` 可以加入到 `routes` 目录下的任意目录中，一个常见的使用示例是添加 `routes/$.tsx` 文件去定制任意层级的 404 页面。
@@ -260,8 +263,8 @@ Modern.js 会生成 `/login` 和 `/sign` 两条路由，`__auth/layout.tsx` 组
 
 ```tsx title="当路由为 / 时"
 <Layout>
-  <Suspense fallback={<Loading/>}>
-    <Page><Page>
+  <Suspense fallback={<Loading />}>
+    <Page />
   </Suspense>
 </Layout>
 ```
@@ -297,15 +300,15 @@ Modern.js 建议必须有根 layout 和根 loading。
 可以通过创建 [`data loader`](/guides/basic-features/data-fetch) 文件做路由的重定向，如有文件 `routes/user/page.tsx`，想对这个文件对应的路由做重定向，可以创建 `routes/user/page.loader.ts` 文件：
 
 ```ts title="routes/user/page.loader.ts"
-import { redirect } from '@modern-js/runtime/router'
+import { redirect } from '@modern-js/runtime/router';
 
 export default () => {
   const user = await getUser();
-  if(!user){
+  if (!user) {
     return redirect('/login');
   }
   return null;
-}
+};
 ```
 
 ### 错误处理
@@ -338,7 +341,7 @@ export default ErrorBoundary;
 
 在每个根 `Layout` 组件中(`routes/layout.ts`)，可以动态地定义应用运行时配置：
 
-```ts title="src/routes/layout.tsx"
+```tsx title="src/routes/layout.tsx"
 // 定义运行时配置
 import type { AppConfig } from '@modern-js/runtime';
 
@@ -348,13 +351,13 @@ export const config = (): AppConfig => {
       createRoutes() {
         return [
           {
-            path: 'edenx',
-            element: <div>edenx</div>,
+            path: 'modern',
+            element: <div>modern</div>,
           },
         ];
       },
     },
-  }
+  };
 };
 ```
 
@@ -378,15 +381,13 @@ export const init = (context: RuntimeContext) => {
 :::
 
 ```ts title="src/routes/layout.tsx"
-import {
-  RuntimeContext,
-} from '@modern-js/runtime';
+import { RuntimeContext } from '@modern-js/runtime';
 
 export const init = (context: RuntimeContext) => {
   return {
     message: 'Hello World',
-  }
-}
+  };
+};
 ```
 
 ```tsx title="src/routes/page.tsx"
@@ -397,7 +398,7 @@ export default () => {
   const { message } = context.getInitData();
 
   return <div>{message}</div>;
-}
+};
 ```
 
 配合 SSR 功能时，浏览器端可以获取到 SSR 时 `init` 返回的数据，开发者可以自行判断是否要在浏览器端重新获取数据来覆盖 SSR 数据，例如：
@@ -409,21 +410,20 @@ export const init = (context: RuntimeContext) => {
   if (process.env.MODERN_TARGET === 'node') {
     return {
       message: 'Hello World By Server',
-    }
+    };
   } else {
     const { context } = runtimeContext;
     const data = context.getInitData();
     // 如果没有获取到期望的数据
     if (!data.message) {
       return {
-        message: 'Hello World By Client'
-      }
+        message: 'Hello World By Client',
+      };
     }
   }
-}
+};
 ```
 
-
 ## 自控式路由
 
 以 `src/App.tsx` 为约定的入口，Modern.js 不会多路由做额外的操作，开发者可以自行使用 React Router 6 的 API 进行开发，例如：

package/docs/zh/guides/concept/entries.mdx

@@ -2,7 +2,7 @@
 sidebar_position: 1
 ---
 
-# 入口（Entry）
+# 入口
 
 通过本章节，你可以了解到 Modern.js 中的入口约定，以及如何自定义入口。
 
@@ -132,9 +132,9 @@ Modern.js 生成的文件内容如下：
 ```js
 import React from 'react';
 import ReactDOM from 'react-dom/client';
-import customBootstrap from '@_edenx_src/index.tsx';
-import App from '@_edenx_src/App';
-import { router, state } from '@edenx/runtime/plugins';
+import customBootstrap from '@_modern_js_src/index.tsx';
+import App from '@_modern_js_src/App';
+import { router, state } from '@modern-js/runtime/plugins';
 
 const IS_BROWSER = typeof window !== 'undefined' && window.name !== 'nodejs';
 const MOUNT_ID = 'root';

package/docs/zh/guides/get-started/upgrade.mdx

@@ -44,7 +44,7 @@ import ReleaseNote from "@site-docs/components/release-note"
 
 对于使用 pnpm 的项目，请在**项目根目录**的 `package.json` 中添加以下配置，然后重新执行 `pnpm install`：
 
-```json
+```json title="package.json"
 {
   "pnpm": {
     "overrides": {
@@ -58,7 +58,7 @@ import ReleaseNote from "@site-docs/components/release-note"
 
 对于使用 Yarn 的项目，请在**项目根目录**的 `package.json` 中添加以下配置，然后重新执行 `yarn install`：
 
-```json
+```json title="package.json"
 {
   "resolutions": {
     "package-name": "^1.0.0"
@@ -70,7 +70,7 @@ import ReleaseNote from "@site-docs/components/release-note"
 
 对于使用 Npm 的项目，请在**项目根目录**的 `package.json` 中添加以下配置，然后重新执行 `npm install`：
 
-```json
+```json title="package.json"
 {
   "overrides": {
     "package-name": "^1.0.0"

package/package.json

@@ -11,13 +11,13 @@
     "modern",
     "modern.js"
   ],
-  "version": "0.0.0-next-1680856068325",
+  "version": "0.0.0-next-1680876402799",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
   "peerDependencies": {
-    "@modern-js/builder-doc": "0.0.0-next-1680856068325"
+    "@modern-js/builder-doc": "0.0.0-next-1680876402799"
   },
   "devDependencies": {
     "classnames": "^2",
@@ -29,9 +29,9 @@
     "fs-extra": "^10",
     "@types/node": "^16",
     "@types/fs-extra": "^9",
-    "@modern-js/builder-doc": "0.0.0-next-1680856068325",
-    "@modern-js/doc-tools": "0.0.0-next-1680856068325",
-    "@modern-js/doc-plugin-auto-sidebar": "0.0.0-next-1680856068325"
+    "@modern-js/builder-doc": "0.0.0-next-1680876402799",
+    "@modern-js/doc-tools": "0.0.0-next-1680876402799",
+    "@modern-js/doc-plugin-auto-sidebar": "0.0.0-next-1680876402799"
   },
   "scripts": {
     "dev": "modern dev",