SuperAPI AI 工具集

sanity-cms

前端与建站

查看项目

更新于 10-16 08:35

技能介绍

该技能用于在项目中实现 Sanity 无头 CMS,按 https://www.sanity.io/learn/llms.txt 的文档实施,并提供面向体育俱乐部的内容建模模式、TypeScript 集成与 Next.js 优化。

用途:为 Williamstown SC 网站管理结构化内容。定义了主要文档类型:blogPost(俱乐部新闻、公告、赛事报道)、event(比赛、训练、俱乐部活动)、player(阵容与球员资料)、fixture(赛程、比分与统计)、sponsor(赞助商与合作伙伴)、page(关于、联系等静态页)、teamMember(教练与委员会成员)。

主要能力: 内容建模,命名采用 camelCase(如 blogPost.ts、featuredImage、fixtureResult),文档含 title、slug 必填字段,并复用 seo 对象(metaTitle 限 60 字符、metaDescription 120-160 字符、ogImage)。示例 schema 覆盖博客、赛程比分、球员资料(含位置、号码、赛季统计)等。 类型安全:在 package.json 添加脚本 "sanity:typegen": "sanity schema extract && sanity typegen generate",改动 schema 后运行 npm run sanity:typegen,从 @/sanity/types 导入 BlogPost、Fixture、Player 类型。 GROQ 查询:提供最新博客、即将进行的赛程(matchDate > now())、历史结果、按位置排序的阵容、单篇文章与引用展开(-> 与 []->)、筛选、排序和分页模式。 图片优化:使用 @sanity/image-url 的 urlFor,结合 Next.js Image 与 srcSet 生成响应式图片,主图支持 hotspot 并要求 alt 文本。 富文本:Portable Text 的 schema 配置与 @portabletext/react 渲染组件。 预览:通过 Next.js 路由启用/禁用草稿模式,使用 process.env.SANITY_PREVIEW_SECRET 校验。

使用方式:按上述文档在项目中实现;安装依赖、配置 client 与 urlFor,定义 schema 后生成类型并编写查询与组件。具体安装命令与配置细节资料未完整提供。

限制:资料未提供收费、价格、平台要求或效果数据;适用场景限于该俱乐部网站及类似体育俱乐部内容管理需求。