docs: quick start now covers both local debugging and Cloudflare deployment paths

hanyixuanten committed 2026-10-25 12:51:30 +00:00
1 parent 656ac79c0d
commit 4755fa991b
2 files changed
+63 -4

No files matched your search

+1 -1
@@ -14,7 +14,7 @@
| 页面 | 内容 | | 页面 | 内容 |
| --- | --- | | --- | --- |
| [[Quick-Start]] | 本地开发、班级信息定制、删除示例内容 | | [[Quick-Start]] | 本地调试 / 部署到 Cloudflare 两种方案、班级信息定制、删除示例内容 |
| [[Content-Format]] | 班史文章 / 歌曲的文件格式与字段说明 | | [[Content-Format]] | 班史文章 / 歌曲的文件格式与字段说明 |
| [[Deployment]] | 构建配置、环境变量总表 | | [[Deployment]] | 构建配置、环境变量总表 |
| [[CMS-Bot]] | 投稿机器人的创建、安装与配置 | | [[CMS-Bot]] | 投稿机器人的创建、安装与配置 |
+62 -3
@@ -1,17 +1,76 @@
# 快速开始与定制 # 快速开始与定制
两种上手方式,按需选择:
- **方案一:本地调试** —— 在自己电脑上跑起来,改文案、调样式、调试 API。
- **方案二:部署到 Cloudflare Pages** —— 连接 Git 仓库直接上线,拿到 `*.pages.dev` 地址,之后 push 即自动部署。
## 环境要求 ## 环境要求
Node.js ≥ 22.12。 Node.js ≥ 22.12(本地调试与 Cloudflare 构建都需要)。
## 本地开发 ## 方案一:本地调试
### 1. 克隆并安装依赖
```bash ```bash
git clone https://github.com/<你的用户名>/<你的仓库>.git
cd <你的仓库>
npm install npm install
```
只是想先看看效果,直接克隆模板仓库也行;正式建站建议先用 **Use this template** 生成自己的仓库(见方案二第 1 步)。
### 2. 只看页面:`npm run dev`
```bash
npm run dev # http://localhost:4321 npm run dev # http://localhost:4321
``` ```
注意:`npm run dev` 只渲染页面,`/api/*` 由 Cloudflare Pages Functions 提供服务,**只有线上可用**——本地留言墙会显示「加载失败」、投稿提交会报错,属正常现象。需要本地调试 API 时可用 `npx wrangler pages dev`。 注意:`npm run dev` 只渲染页面,`/api/*` 由 Cloudflare Pages Functions 提供服务——本地留言墙会显示「加载失败」、投稿提交会报错,属正常现象。
### 3. 调试 API(留言墙 / 投稿):`wrangler pages dev`
要本地调通 `/api/*`,先构建,再用 wrangler 起一个带 Functions 的本地服务:
```bash
npm run build
npx wrangler pages dev dist --d1 DB # http://localhost:8788
```
- `--d1 DB`:本地模拟留言墙用的 D1 数据库(绑定名必须是 `DB`),数据落在 `.wrangler/state/`,与线上无关;表结构首次访问时自动创建。
- 投稿接口的 `GITHUB_*` 运行时变量:wrangler 会自动读取项目根目录的 `.env`(复制 `.env.example` 填好即可);不配则投稿不可用,其余功能正常。
- 改动页面或内容后重新 `npm run build`,刷新页面即可看到最新效果。
## 方案二:部署到 Cloudflare Pages
### 1. 生成自己的仓库
在[模板仓库](https://github.com/Vb-Lg/class-history-template)页点 **Use this template → Create a new repository**(比 fork 干净,不带模板的提交历史)。
### 2. 连接仓库
Cloudflare Dashboard → Workers & Pages → Create → Pages → Connect to Git → 选择你的仓库。
### 3. 构建配置
| 配置项 | 值 |
| --- | --- |
| Framework preset | None(或 Astro) |
| Build command | `npm run build` |
| Build output directory | `dist` |
| 环境变量 | `NODE_VERSION = 22.12.0` |
保存后 Cloudflare 自动构建,完成即可访问 `https://<项目名>.pages.dev`。
### 4. 按需开启功能
初始部署后站点即可正常浏览,以下功能按需配置:
- **留言墙**:创建 D1 数据库并绑定到 Pages(变量名 `DB`)→ [[Message-Board]]
- **在线投稿**:创建 GitHub App 并配置 `GITHUB_*` 环境变量 → [[CMS-Bot]]
完整环境变量总表见 [[Deployment]]。之后每次 push 到默认分支(或合并投稿 PR)都会自动重新部署。
## 定制班级信息 ## 定制班级信息