adr-source-v2
基于Next.js与Hygraph CMS的现代化网站开发框架
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：adr-source-v2。 它的用途是：基于Next.js与Hygraph CMS的现代化网站开发框架 完整的 Skill 内容见：https://321skill.com/skills/adr-source-v2/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“我需要基于Next.js和Hygraph快速搭建一个公司官网原型，请指导我使用adr-source-v2框架。”，它会提供从环境配置、依赖安装到启动开发服务器的完整步骤。或者
对AI说：“我的adr-source-v2项目在构建时报错，提示环境变量缺失”，它会帮你检查.env.local文件的配置项是否与Hygraph后台设置匹配。
介绍
adr-source-v2 是一个基于 Next.js 14 构建的现代化网站开发框架，旨在解决开发者快速搭建内容驱动型网站时，需要手动集成CMS、配置环境、处理预览与生产模式等繁琐问题。它预先集成了Hygraph CMS（GraphCMS），提供了从环境变量配置、依赖安装到本地开发服务器的完整开箱即用工作流。
使用方式非常直接：克隆仓库后，按照指引配置好Hygraph空间相关的环境变量，运行 pnpm install 安装依赖，再执行 pnpm dev 即可启动本地开发服务器，在浏览器中实时查看和编辑页面。框架内置了字体优化等Next.js最佳实践。
该框架非常适合需要快速启动一个具备强大内容管理能力的前端项目的开发者，特别是那些专注于内容展示、营销官网或博客站点的团队。它降低了从零开始配置Next.js与Headless CMS集成的技术门槛。
需要注意的是，此框架深度绑定Hygraph CMS，如果你计划使用其他CMS（如Strapi、Contentful）或无需CMS，则需要对其进行较大改造。此外，项目对Node.js和pnpm版本有特定要求，需确保本地环境匹配。
核心特点
与通用Next.js启动模板相比，它深度集成了Hygraph CMS，预置了生产与预览环境Token、Webhook校验、草稿模式等企业级内容管理功能所需的完整配置，让开发者能立即专注于业务开发而非底层集成。
注意事项
不适合需要脱离Hygraph CMS或使用其他Headless CMS的快速原型项目。
常见问题
如何获取Hygraph的CMS_PROD_TOKEN等环境变量？
需要在Hygraph后台对应Space的Settings -> API Access中创建并获取生产与预览API令牌，以及Webhook密钥。
能否使用npm或yarn代替pnpm？
项目锁文件为pnpm-lock.yaml，强烈建议使用pnpm以保证依赖一致性，使用其他包管理器可能需要手动解决依赖问题。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/adr-source-v2/raw/index.md 读取 adr-source-v2 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/adr-source-v2/raw/index.md（查看排版版本）