@modern-js/main-doc 2.54.5 → 2.55.0

package/package.json

@@ -15,17 +15,17 @@
     "modern",
     "modern.js"
   ],
-  "version": "2.54.5",
+  "version": "2.55.0",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public",
     "provenance": true
   },
   "dependencies": {
-    "@modern-js/sandpack-react": "2.54.5"
+    "@modern-js/sandpack-react": "2.55.0"
   },
   "peerDependencies": {
-    "@modern-js/builder-doc": "^2.54.5"
+    "@modern-js/builder-doc": "^2.55.0"
   },
   "devDependencies": {
     "classnames": "^2",
@@ -39,8 +39,8 @@
     "@rspress/shared": "1.18.2",
     "@types/node": "^16",
     "@types/fs-extra": "9.0.13",
-    "@modern-js/doc-plugin-auto-sidebar": "2.54.5",
-    "@modern-js/builder-doc": "2.54.5"
+    "@modern-js/doc-plugin-auto-sidebar": "2.55.0",
+    "@modern-js/builder-doc": "2.55.0"
   },
   "scripts": {
     "dev": "rspress dev",

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

@@ -1,186 +0,0 @@
----
-title: pages/
-sidebar_position: 3
----
-# pages/
-
-The identifier for the entry point when the application uses the [`Pages` entry](https://modernjs.dev/v1/docs/guides/usages/entries#pages-%E5%85%A5%E5%8F%A3) type.
-
-:::info
-Compatible with Modern.js 1.0 `Pages` entry. It is recommended to use [conventional routing](guides/basic-features/routes.html#conventional-routing).
-:::
-
-When the project structure is of the `Pages entry` type, the client-side routing configuration will be obtained by analyzing the files in the `src/pages` directory.
-
-For example, the following directory structure:
-
-```bash
-.
-└── src
-    └── pages
-        ├── about
-        │   └── index.jsx
-        ├── index.jsx
-        └── info.jsx
-```
-
-The corresponding generated routing configuration is:
-
-```bash
-[
-  { path: '/', component: 'pages/index.jsx' },
-  { path: '/info' component: 'pages/info.jsx' },
-  { path: '/about', component: 'pages/about/index.jsx' }
-]
-```
-
-Files under the pages directory that meet the following conditions will not be treated as routing files:
-
-- Files whose suffix is not `.(j|t)sx?`.
-- `.d.ts` type definition files.
-- Test files ending in `.test.(j|t)sx?` or `.spec.(j|t)sx?` or `.e2e.(j|t)sx?`.
-
-:::tip
-It is recommended to only write entry code in the pages directory and write business logic in the independent features directory outside the pages directory. In this way, most of the files under the pages directory will be routing files, and there is no need for additional filtering rules.
-
-:::
-
-### Dynamic Routing
-
-If the directory name of the route file is named with [], the generated route will be used as a dynamic route.
-
-For example, the following directory structure:
-
-```bash
-.
-└── src
-    └── pages
-        ├── [post]
-        │   ├── detail.jsx
-        │   └── index.js
-        ├── users
-        │   └── [id].jsx
-        ├── index.jsx
-        └── info.jsx
-```
-
-The corresponding generated routing configuration is:
-
-```js
-[
-  { path: '/', component: 'pages/index.jsx' },
-  { path: '/info', component: 'pages/info.jsx' },
-  { path: '/:post/', component: 'pages/[post]/index.js' },
-  { path: '/:post/detail' components: 'pages/[post]/detail.jsx'},
-  { path: '/users/:id', components: 'pages/users/[id].jsx'}
-]
-```
-
-On the basis of dynamic routing, special routing suffixes `(*, ?, +)` can be added.
-
-For example: `src/pages/users/[id]*.tsx` will result in the route `/users/:id*`.
-
-### Global Layout
-
-When the entire application needs a global `layout`, it can be achieved through `pages/_app.tsx`. The specific writing method is as follows:
-
-```js
-import React from 'react';
-import UserLayout from 'xxxx';
-
-export const App = ({Component, ...pageProps}:{ Component: React.ComponentType}) => {
-  return (
-    <UserLayout>
-      <Component {...pageProps} />
-    </UserLayout>
-  );
-}
-```
-
-The above `Component` is the component matched when accessing a specific route.
-
-For example, the following directory structure:
-
-```bash
-.
-└── pages
-    ├── a
-    │   ├── b
-    │   │   └── index.js
-    │   └── index.js
-    └── index.js
-```
-
-- Accessing `/` corresponds to the `Component` component in `pages/index.js`.
-- Accessing `/a` corresponds to the `Component` component in `pages/a/index.js`.
-- Accessing `/a/b` corresponds to the `Component` component in `pages/a/b/index.js`.
-
-:::tip Advantages of global layout
-
-- Preserve the state of the global layout when the page changes.
-- Add global styles.
-- ComponentDidCatch error handling.
-- Use [defineConfig](/apis/app/runtime/app/define-config) to dynamically configure the runtime configuration.
-
-:::
-
-### Partial Layout
-
-When developing an application, there are scenarios where sub-routes under the same route share a layout.
-
-For this scenario, Modern.js conventionally has a similar effect to global layout when there is `_layout.js` under the directory.
-
-For example, the following directory structure:
-
-```bash
-└── pages
-    ├── a
-    │   ├── b
-    │   │   └── index.js
-    │   ├── _layout.js
-    │   └── index.js
-    └── index.js
-```
-
-```js title="pages/a/_layout.js"
-import React from 'react';
-
-const ALayout = ({ Component, ...pageProps }) => {
-  return <Component {...pageProps} />;
-};
-export default ALayout;
-```
-
-The `Component` parameter is the component corresponding to a specific accessed route, for example:
-
-- Accessing `/a` corresponds to the `Component` component in `pages/a/index.js`.
-- Accessing `/a/b` corresponds to the `Component` component in `pages/a/b/index.js`.
-
-In this way, `pages/a/_layout.js` can be used to meet the layout needs of shared routes under the `a` directory.
-
-### 404 Route
-
-`pages/404.[tj]sx` is conventionally the default 404 route.
-
-For example, the following directory structure:
-
-```bash
-.
-└── src
-    └── pages
-        ├── user.js
-        ├── home.js
-        ├── 404.js
-```
-
-The generated routing configuration is as follows:
-
-```bash
-[
- { path: '/user', component: './pages/user.js'},
- { path: '/home', component: './pages/home.js' },
- { path: '*', component: './pages/404.js'}
-]
-```
-
-All unmatched routes will be matched to `pages/404.[tj]s`.

package/docs/zh/apis/app/hooks/src/pages.mdx

@@ -1,187 +0,0 @@
----
-title: pages/
-sidebar_position: 3
----
-# pages/
-
-应用使用 [`Pages` 入口](https://modernjs.dev/v1/docs/guides/usages/entries#pages-%E5%85%A5%E5%8F%A3)时的入口标识。
-
-:::info
-兼容 Modern.js 1.0 `Pages` 入口，推荐使用[约定式路由](guides/basic-features/routes.html#约定式路由)。
-:::
-
-当项目结构为 `Pages 入口`类型时， 会分析 `src/pages` 目录下的文件得到客户端路由配置。
-
-举例说明，例如以下目录结构：
-
-```bash
-.
-└── src
-    └── pages
-        ├── about
-        │   └── index.jsx
-        ├── index.jsx
-        └── info.jsx
-```
-
-对应生成的路由配置为：
-
-```bash
-[
-  { path: '/', component: 'pages/index.jsx' },
-  { path: '/info' component: 'pages/info.jsx' },
-  { path: '/about', component: 'pages/about/index.jsx' }
-]
-```
-
-pages 目录下的文件满足以下条件的不会被当做路由文件
-
-- 后缀不是 `.(j|t)sx?` 的文件。
-- `.d.ts` 类型定义文件。
-- 以 `.(test|spec|e2e).(j|t)sx?` 结尾的测试文件。
-
-:::tip 提示
-
-推荐 pages 目录下只写入口代码，把业务逻辑写到 pages 外面独立的 features 目录里。这样 pages 目录下大部分文件都会是路由文件，也就不需要额外的过滤规则。
-
-:::
-
-### 动态路由
-
-使用 `[ ]` 包裹的目录或文件会被视为动态路由
-
-例如以下目录结构:
-
-```bash
-.
-└── src
-    └── pages
-        ├── [post]
-        │   ├── detail.jsx
-        │   └── index.js
-        ├── users
-        │   └── [id].jsx
-        ├── index.jsx
-        └── info.jsx
-```
-
-对应生成的路由配置为:
-
-```js
-[
-  { path: '/', component: 'pages/index.jsx' },
-  { path: '/info', component: 'pages/info.jsx' },
-  { path: '/:post/', component: 'pages/[post]/index.js' },
-  { path: '/:post/detail' components: 'pages/[post]/detail.jsx'},
-  { path: '/users/:id', components: 'pages/users/[id].jsx'}
-]
-```
-
-动态路由的基础上，支持添加特殊的路由后缀 `(*、?、+)`。
-
-例如：`src/pages/users/[id]*.tsx` 最终路由为 `/users/:id*`
-
-### 全局 layout
-
-整个应用需要全局的 `layout` 时， 可以通过 `pages/_app.tsx` 实现，具体写法如下:
-
-```js
-import React from 'react';
-import UserLayout from 'xxxx';
-
-export const App = ({Component, ...pageProps}:{ Component: React.ComponentType}) => {
-  return (
-    <UserLayout>
-      <Component {...pageProps} />
-    </UserLayout>
-  );
-}
-```
-
-上述 `Component` 为访问具体路由匹配到的组件。
-
-例如以下目录结构:
-
-```bash
-.
-└── pages
-    ├── a
-    │   ├── b
-    │   │   └── index.js
-    │   └── index.js
-    └── index.js
-```
-
-- 访问 `/` 时，对应的 `Component` 组件为 `pages/index.js`。
-- 访问 `/a` 时，对应的 `Component` 组件为 `pages/a/index.js`。
-- 访问 `/a/b` 时，对应的 `Component` 组件为 `pages/a/b/index.js`。
-
-:::tip 全局 layout 有以下优点
-
-- 页面变化时，保留全局布局的状态
-- 添加全局样式
-- ComponentDidCatch 错误处理
-- 使用 [defineConfig](/apis/app/runtime/app/define-config) 动态配置运行时配置。
-
-:::
-
-### 部分 layout
-
-开发应用时，存在同一路由下的子路由共用 layout 的场景。
-
-针对这一场景，Modern.js 约定，当目录下存在 `_layout.js` ，就会有类似全局 layout 的效果。
-
-例如以下目录结构:
-
-```bash
-└── pages
-    ├── a
-    │   ├── b
-    │   │   └── index.js
-    │   ├── _layout.js
-    │   └── index.js
-    └── index.js
-```
-
-```js title="pages/a/_layout.js"
-import React from 'react';
-
-const ALayout = ({ Component, ...pageProps }) => {
-  return <Component {...pageProps} />;
-};
-export default ALayout;
-```
-
-Component 参数为访问具体路由对应的组件，例如
-
-- 访问 `/a` 时，对应的 `Component` 组件为 `pages/a/index.js`。
-- 访问 `/a/b` 时，对应的 `Component` 组件为 `pages/a/b/index.js`。
-
-这样就可以用 `pages/a/_layout.js` 满足 `a` 目录下路由共用 layout 的需求。
-
-### 404 路由
-
-约定 `pages/404.[tj]sx` 为默认的 404 路由。
-
-例如以下目录结构:
-
-```bash
-.
-└── src
-    └── pages
-        ├── user.js
-        ├── home.js
-        ├── 404.js
-```
-
-生成路由配置如下:
-
-```bash
-[
- { path: '/user', component: './pages/user.js'},
- { path: '/home', component: './pages/home.js' },
- { path: '*', component: './pages/404.js'}
-]
-```
-
-所有未匹配的路由，都将匹配到 `pages/404.[tj]s`。

package/docs/zh/apis/monorepo/commands/deploy.mdx

@@ -1,38 +0,0 @@
----
-sidebar_position: 7
----
-# deploy
-
-```bash
-Usage: modern deploy [options]
-
-deploy project
-
-Options:
-  -p, --path [path]  Specify the path of the output files (default: "output")
-  -h, --help         display help for command
-```
-
-对指定的项目进行部署，会通过指定项目分析其依赖的 Monorepo 下的子项目。
-
-在执行命令之后，会首先生成 `output` 目录，在目录当中包含了指定部署的项目以及其依赖的子项目，形成一个最小集合的 Monorepo。
-
-:::info 补充信息
-`output` 目录是默认目录，可以通过 `-p` 参数进行自定义。
-
-:::
-
-然后会在 `output` 目录下进行依赖的安装以及必要文件的复制。
-
-最后当依赖安装完成后，便完成了对指定项目的部署任务。
-
-例如部署项目名称为 `app` 的应用，则可以执行：
-
-```
-pnpm deploy app
-```
-
-:::info 补充信息
-其中 `app` 为项目的 `package.json` 的 `name` 值。
-
-:::