背景 我最近在做一个实验项目：agentclaw.sale — 一个域名下跑三个内容站（AI工具/穿搭指南/一人公司运营），全部由一个人维护。技术选型的关键约束：零成本、一人维护、内容友好、SEO达标。最终方案：Next.js 14 (SSG) + Tailwind CSS 4 + Vercel (Free Tier)。
一、架构设计：子路径路由 vs 子域名 传统的多站方案是 tool.agentclaw.sale、fashion.agentclaw.sale。但每个子域名需要单独配DNS、额外SSL配置、SEO权重分散。所以我用子路径方案：agentclaw.sale 下 /tool /wear /ops 三个子站。
二、内容管理：不用数据库，用JSON文件 每篇文章存为一个JSON文件在 src/lib/content/ 下，包含slug、title、excerpt、content（Markdown格式）、site字段。Next.js的 generateStaticParams 在构建时读取JSON生成静态HTML。用 index.json 维护全部文章的元数据，避免构建时扫描全部文件。
三、内容渲染：react-markdown + 自定义组件 用 react-markdown + remark-gfm，自定义h2/h3/img/table/blockquote每个标签的渲染。每篇文章配有对应的Hero大图，在组件中建立slug到图片路径的映射。29张图片全部来自Unsplash免费图库。
四、多语言方案：轻量级i18n 不引入第三方库，仅UI外壳翻译（导航栏、首页、Footer），文章内容保持中文。React Context实现客户端切换。右上角下拉选择器，中/英/日一键切换。
五、部署流水线：Git push → Vercel → 上线 本地写内容 → git commit → git push → Vercel自动构建 → 上线。构建脚本先生成sitemap.xml再构建Next.js。robots.txt放行GPTBot/ClaudeBot/CCBot，每篇文章嵌入JSON-LD Article Schema结构化数据。
六、关键经验总结 AI生成重复段落问题用脚本自动检测。本地SWC构建失败直接用Vercel云端构建。Windows PowerShell编码问题用 cmd /c "node xxx.mjs" 替代。图片只用Unsplash免费商用图。全部成本：域名¥45/年。
七、开源 整个系统的架构文档、路线图已开源：github.com/jaylong1611… 站点：agentclaw.sale
标签建议：Next.js、Vercel、前端架构、全栈、独立开发
