@modern-js/main-doc 2.0.0-beta.1 → 2.0.0-beta.2

package/zh/components/deploy.md

@@ -1,60 +0,0 @@
-Modern.js 支持通过云平台一键部署应用。
-
-使用云平台部署应用，我们需要先开启部署功能。在项目根目录下执行 `pnpm run new`，进行如下选择：
-
-```bash
-? 请选择你想要的操作：启用可选功能
-? 启用可选功能：启用「部署」功能
-? 默认使用框架自带的专业 Web 服务器，是否调整：否
-? 请选择 CDN 平台：阿里云 OSS
-? 请选择云函数平台：阿里云 FC
-```
-
-安装依赖后，可以看到 package.json 中新增了两项依赖：
-
-```bash
-+ "@modern-js/plugin-lambda-fc": "^1"
-+ "@modern-js/plugin-cdn-fc": "^1"
-```
-
-我们可以在项目根目录下的 `.env` 中添加云平台必要的账号信息，以阿里云为例，包括 `accountId`、`secretId` 和 `secretKey`。使用 CDN 上传还需要配置 `bucketName`。
-
-部分**可暴露的、可以进入代码仓库**的环境变量可以放在项目的 `.env` 文件中，例如：
-
-```bash
-# 阿里云账号 ID
-CLOUD_ACCOUNT_ID
-# 阿里云 OSS Bucket 名称
-CLOUD_BUCKET_NAME
-```
-
-鉴权相关信息**必须在平台上配置，不能进入代码仓库**。为了方便本地测试，我们临时的在 `.env` 中添加：
-
-```bash
-# 阿里云访问 AK
-CLOUD_SECRET_ID
-# 阿里云访问 SK
-CLOUD_SECRET_KEY
-```
-
-:::warning 警告
-此处仅仅是用于本地测试，SecretID/SecretKey 必须从代码中移除，避免信息泄露。
-:::
-
-1. AccountID 在[阿里云账号中心页](https://account.console.aliyun.com/v2/#/basic-info/index)获取。
-
-2. SecretID（AccessKey ID），SecretKey（AccessKey Secret），在[用户信息管理页](https://usercenter.console.aliyun.com/#/manage/ak)获取。
-
-3. Bucket 信息可以从阿里云 OSS 的 [Bucket 列表](https://oss.console.aliyun.com/bucket)中获取。
-
-我们可以根据 OSS 的 Bucket 名称和 Region 名称拼接出 OSS 的临时域名，并设置为[静态资源域名前缀](/docs/configure/app/output/asset-prefix)：
-
-```js
-export default defineConfig({
-  output: {
-    assetPrefix: "https://{bucketName}.oss-{bucketRegion}.aliyuncs.com/"
-  }
-}
-```
-
-执行 `pnpm run deploy` 命令后，应用将会先执行构建，将静态资源上传到 OSS 以及将应用部署到阿里云 FC 中。

package/zh/components/dev-ide.md

@@ -1 +0,0 @@
-Modern.js 对 VS Code 等主流 IDE 提供了开箱即用的支持，具备 Lint 问题自动检测、自动修复，代码提交前的准入检查等功能特性，可以让代码开发更加高效和智能。详细介绍请参考【[确认编程环境](/docs/tutorials/first-app/c03-ide/3.1-setting-up)】。

package/zh/components/entry-name.md

@@ -1,15 +0,0 @@
-## 入口名称
-
-默认情况下，「入口名称」为页面入口所在目录的名称。
-
-例如，项目的目录结构如下时，入口名称为 `page-a` 和 `page-b`。
-
-```
-└── src
-    ├── page-a
-    │   └── App.jsx
-    └── page-b
-        └── App.jsx
-```
-
-如果使用 [source.entries](/docs/configure/app/source/entries) 自定义了页面入口，则「入口名称」为 `source.entries` 对象的 `key`。

package/zh/components/env-prepare.md

@@ -1 +0,0 @@
-开始之前，请参考【[环境准备](/docs/tutorials/first-app/c01-getting-started/1.1-prerequisites)】部分，确保本地环境正常。

package/zh/components/launch-bff-choices.md

@@ -1,6 +0,0 @@
-```bash
-? 请选择你想要的操作: 启用可选功能
-? 启用可选功能: 启用「BFF」功能
-? 请选择 BFF 类型：函数写法
-？请选择运行时框架：Express
-```

package/zh/guides/advanced-features/bff/bff-server.md

@@ -1,142 +0,0 @@
----
-sidebar_position: 3
-title: 定制 BFF Server
----
-
-BFF Server 与应用一体，共同开发、调试、部署，开发者通常只需要写函数即可。但有时，应用中会存在一些 BFF 函数的通用前置逻辑，例如权限校验。
-
-在[一体化 Web 专题](/docs/guides/advanced-features/web-server)中提到过，Modern.js 支持定制 Web Server。同样，Modern.js 也为 BFF Server 提供了扩展能力。
-
-Modern.js 允许开发者创建 `api/_app.ts` 文件，在该文件中对定制自己的 BFF Server。
-
-和 Web Server 相同，默认支持了 4 种主流的 Node.js Server 框架：Express、Koa、Egg、Nest，开发者可以根据自身偏好，选择合适的框架来编写 `api/_app.ts`。
-
-这里先以 Express 为例来展示一下用法，下一章节会详细介绍各个框架扩展的写法。
-
-首先创建项目，并[开启 BFF 功能](/docs/tutorials/first-app/c09-bff/9.2-enable-bff)，这时项目的目录结构是：
-
-```md
-.
-├── README.md
-├── api
-│   ├── _app.ts
-│   ├── index.ts
-│   └── info
-│       └── [type].ts
-├── modern.config.ts
-├── package.json
-├── pnpm-lock.yaml
-├── src
-│   ├── App.css
-│   ├── App.tsx
-│   ├── index.test.ts
-│   └── modern-app-env.d.ts
-└── tsconfig.json
-```
-
-创建一个 `api/login.ts` 文件用于实现登录：
-
-```ts
-import { useContext } from '@modern-js/runtime/server';
-
-export const post = async () => {
-  const ctx = useContext();
-  ctx.res.cookie('sid', Math.random());
-
-  return { code: 0, message: 'OK' };
-};
-```
-
-:::info 补充信息
-`useContext` API 用于获取请求上下文，具体用法可以看 [API 文档](/docs/apis/app/runtime/bff/use-context)。
-:::
-
-接下来修改 `api/_app.ts`，手写一个中间件用于权限校验：
-
-```ts
-import { hook } from '@modern-js/runtime/server';
-import { Request, Response, NextFunction } from 'express';
-
-export default hook(({ addMiddleware }) => {
-  addMiddleware(async (req: Request, res: Response, next: NextFunction) => {
-    if (req.url !== '/api/login') {
-      const sid = req?.cookies?.sid;
-      if (!sid) {
-        res.status(400);
-        res.json({ code: -1, message: 'need login' });
-      } else {
-        next();
-      }
-    } else {
-      next();
-    }
-  });
-});
-```
-
-然后添加一个普通的接口函数文件 `/api/hello.ts`：
-
-```ts
-export default async () => {
-  return 'Hello Modern.js';
-};
-```
-
-最后在前端 `/src/App.tsx` 添加接口的访问代码，直接使用一体化调用的方式：
-
-```ts
-import { useState, useEffect } from 'react';
-import { get as hello } from '@api/hello';
-
-export default () => {
-  const [text, setText] = useState('');
-
-  useEffect(() => {
-    async function fetchMyApi() {
-      const { message } = await hello();
-      setText(message);
-    }
-
-    fetchMyApi();
-  }, []);
-
-  return <p>{text}</p>;
-};
-```
-
-然后 `pnpm run dev` 启动项目，访问 [http://localhost:8080/](http://localhost:8080/) 会发现 `/api/hello` 的请求被拦截了：
-
-![Network](https://lf3-static.bytednsdoc.com/obj/eden-cn/aphqeh7uhohpquloj/modern-js/docs/network2.png)
-
-我们再修改前端代码 `src/App.tsx`，在访问 `/api/hello` 前先调用登录接口：
-
-```ts
-import { useState, useEffect } from 'react';
-import { get as hello } from '@api/hello';
-import { post as login } from '@api/login';
-
-export default () => {
-  const [text, setText] = useState('');
-
-  useEffect(() => {
-    async function fetchAfterLogin() {
-      const { code } = await login();
-      if (code === 0) {
-        const { message } = await hello();
-        setText(message);
-      }
-    }
-    fetchAfterLogin();
-  }, []);
-
-  return <p>{text}</p>;
-};
-```
-
-刷新页面，可以看到 `/api/hello` 访问成功：
-
-![Network](https://lf3-static.bytednsdoc.com/obj/eden-cn/aphqeh7uhohpquloj/modern-js/docs/network3.png)
-
-以上代码模拟了在 `/api/_app.ts` 中添加中间件的方式，实现了简易的登录功能。
-
-同样，可以在这个钩子文件中实现其他功能来扩展 BFF Server。

package/zh/guides/advanced-features/typescript.md

@@ -1,4 +0,0 @@
----
-title: TS 支持
-sidebar_position: 9
----

package/zh/guides/concept/integrated.md

@@ -1,4 +0,0 @@
----
-title: 一体化开发
-sidebar_position: 3
----

package/zh/guides/concept/solutions.md

@@ -1,4 +0,0 @@
----
-title: 工程方案
-sidebar_position: 4
----