Next.js + Sanity 博客交给 Claude：40题问卷 + 人工审批 + 1100行技术规范

做过 Next.js 项目的同学都知道，加上博客模块是个脏活累活。SEO、国际化、CMS、工作流……每次重写一遍，写完了还总漏点东西。

这个 Skill——building-blog——把这件事彻底标准化了。装上它，对 Claude Code 说一句「add a blog to this project」，它会先做 40 道题目的问卷，覆盖语言、作者模型、分类、SEO、AI 配图等所有决策维度，然后生成一页实施方案等你确认，确认后才开始写代码。

一套规范，比每次重写都全面

这 Skill 的核心不是代码模板，而是一份 1100 行的技术规范（blog-technical-requirements.md），内容覆盖：

• Sanity Schema 设计
• URL 结构 + hreflang 规则
• BlogPosting + FAQPage 的 JSON-LD 结构化数据
• OG 标签 + Atom Feed
• 性能预算（比 Google「良好」基线更紧）
• WCAG 2.2 AA 无障碍标准
• 删除/下架的 Webhook 处理

你不需要懂这些细节——Skill 会自动执行。规范存在是为了让 Claude 的输出稳定、可审计，而不是每次凭感觉生成一段略有不同的代码。

人工审批是强制关卡

问卷填完，Claude 会给你一页实施方案（one-page plan），停在「等你确认」的状态。只有你点了同意，才会真正开始写代码。

这个设计很有 CTO 思维：AI 负责执行，人负责决策。变更方案可逆就跑流程，不可逆（涉及数据模型迁移、认证路径修改）则触发额外的安全门。博客这种模块通常属于可逆范围，所以大多数时候你只需要过一个审批关。

AI 配图，开箱即用

内置了 Gemini 3 Pro Image（Nano Banana Pro）的 TypeScript 生成器，自动为每篇文章生成配图。图片支持多语言 slug、幂等重跑，还有一个品牌风格指南模板（blog-image-style-guide.md）让 AI 生成的图片风格统一。

Stack：Next.js App Router + Sanity v3 + next-intl

支持 Next.js 14/15（16 的已知陷阱有文档说明），Sanity Studio 可独立托管或嵌入 /studio 目录，多语言用 next-intl 实现，单语言项目自动跳过 i18n 部分。Tailwind 样式规则在规范里固定死了，但其他设计系统可以自行覆盖。

怎么用

Claude Code 用户推荐用插件方式安装：

/plugin marketplace add BuildShipGrowRepeat/nextjs-sanity-blog-skill
/plugin install building-blog@nextjs-sanity

或者手动 clone 后放入 ~/.claude/skills/ 目录。安装后对着 Claude 说「add a blog to this project」即可触发整个流程。

一个 Skill，把博客模块从「每次重写的临时工程」变成「可复制、可审计、有质量门卡的标准化组件」——适合所有用 Next.js 做企业站点的团队。

GitHub 地址 →

GitHub: https://github.com/BuildShipGrowRepeat/nextjs-sanity-blog-skill