---
url: /docs/agentbuff-stack/website-showcase.md
---
# 模板官网、案例与独立演示

## 三个职责

`apps/website` 是介绍 AgentBuff Stack 的静态官网；`apps/web`、`apps/app` 与 `apps/api` 是可生成的产品底座；案例对应独立域名上的产品。生成新站不会复制官网、官网文章、案例素材或销售配置。

官网不读取用户订阅套餐，不连接产品数据库。当前尚处于自用验证阶段，定价页没有商业报价或购买流程。现有 JSON 与文本工具是独立演示中的样例，不作为已上线案例。

## 配置官网

官网文案与导航位于 `apps/website/config/site.ts`，功能与验收状态位于 `apps/website/lib/modules.ts`。只记录已实现的能力；外部服务尚未实测时继续标明待验收。

环境配置为 `WEBSITE_ORIGIN`、`WEBSITE_DOCS_URL`、`WEBSITE_DEMO_URL`，分别控制官网公开域名、教程入口和独立演示地址。公开地址必须使用 HTTPS，不能指向 localhost；未配置的教程或演示入口会隐藏。本地预览仍使用原端口。

本仓库发布范围是 `stack.agentbuff.dev` 静态官网与 `/docs/` 下的双语教程，暂时隐藏演示。自定义域名声明在 `apps/website/wrangler.jsonc`，不属于产品三个 Worker 的测试环境。官网无需 Neon、Hyperdrive、任务队列或模型服务；产品仍暂不上线。

复制 `.env.website.example` 为 `.env.website.local`：

```dotenv
WEBSITE_ORIGIN=https://stack.agentbuff.dev
WEBSITE_DOCS_URL=https://stack.agentbuff.dev/docs/agentbuff-stack/
WEBSITE_DEMO_URL=
```

运行 `bun website:package`，会先核对域名与教程入口，再在新的 `.local/website-release-*` 目录构建官网与双语教程，生成专用 `wrangler.jsonc` 和发布清单。官网与教程共用根站点地图索引；教程资源、搜索、语言切换与规范链接均带 `/docs/` 前缀。该命令不发布，也不覆盖本地预览产物。清单包含源码版本和构建时是否有未提交修改，保存在静态资源目录外。

检查产物后，使用输出中的配置路径运行 `bunx wrangler deploy --dry-run --config <发布目录>/wrangler.jsonc`；离线打包通过不代表上线。完成 Cloudflare 登录并确认目标域名权限后，运行 `bunx wrangler deploy --config <发布目录>/wrangler.jsonc` 上传已检查的同一份产物。`bun website:deploy` 会重新生成发布包并上传，需先准备账号权限；这两个官网入口都不迁移数据库、不部署产品 Worker。

`bun preview:build` 根据 `preview.config.json` 构建本地官网和演示。本仓库官网为 `http://localhost:4400`，产品演示为 `http://localhost:4410`，教程为 `http://localhost:4406`。生成项目只有自己的产品预览，不包含官网、官网发布脚本或专用环境文件。

单独官网构建命令是 `bun website:build`，检查命令是 `bun website:check`。公开官网与教程合并发布应使用 `website:package` 的产物；现有 `deploy:staging/production` 仍只部署产品三个 Worker。

## 添加真实案例

在 `apps/website/content/showcase/` 添加小写文件名，如 `my-product.md`。文件名生成案例路径 `/showcase/my-product`。截图放在 `apps/website/public/showcase/my-product.webp`。

以下是字段示例，不是已上线案例；确认网站真实上线并放入实际截图后，才能把状态改为 `live`。

```yaml
---
name: My Product
summary: Describe the task and its deliverable.
siteUrl: https://your-real-product.com
screenshot: /showcase/my-product.webp
screenshotAlt: Describe the actual product screenshot.
category: File conversion
modules:
  - accounts
  - content
templateVersion: 0.3.0
templateRevision: deb7b185
publishedAt: "2026-10-09"
status: draft
---
```

正文描述具体任务、输入、预览、输出、复用模块与自定义部分。版本与 revision 从独立产品的 `template.json` 读取，示例值必须更换为真实记录。

状态包括 `draft`（草稿）、`preview`（本地记录）、`live`（已上线）。只有 `live` 进入首页、案例列表、公开详情和 sitemap。预览记录也不作为线上案例发布。所有记录仍需完整字段和存在的截图，避免未来发布时才发现内容损坏。

首页、列表、详情与 sitemap 消费同一份已发布记录。URL、日期、图片字段或截图文件无效时构建失败，错误包含对应字段或记录。尚无上线案例时显示说明，仅在演示地址已配置时显示演示入口。

流量、收入不是案例必填项。补充时记录数据来源、日期、统计期间和全站或页面口径，不从报价页推断收入。

## 官网文章与产品文章

官网文章在 `apps/website/content/blog/*.md`，写建站实践、架构决策和案例拆解。字段为 title、description、date、author、category，可选 updated 与 draft。草稿不生成公开详情、列表、RSS 或 sitemap。

产品文章仍位于 `apps/web/content/blog/*.md`，面向产品用户。两套文章分别生成自己的 canonical、RSS 和 sitemap，不共享文章清单。两套应用复用展示卡片与设计变量。

## 公共界面边界

`packages/ui/marketing` 提供导航、主题脚本、文章卡片及公共排版。导航接收品牌、链接、主操作与可选次操作，不读取 `core`、用户会话或固定工作台路径。各应用负责文案、内容加载和页面组合。

修改导航后检查浅深主题、滚动收缩、手机菜单、键盘退出与外链。修改产品认证和授权则运行对应回归测试。