SuperAPI AI 工具集

tinacms

通用与其它

查看项目

更新于 10-15 22:39

技能介绍

用途:TinaCMS 是开源、基于 Git 的无头 CMS,让开发者与内容创作者在内容密集型网站上协作。内容以 Markdown、MDX 或 JSON 文件存入 Git 仓库,具备完整版本历史,无供应商锁定。

主要能力:可视化/上下文编辑,支持并排编辑与实时预览;schema 驱动建模,在 tina/config.ts 中定义内容结构,自动生成类型安全的 GraphQL API;集合与字段系统组织内容;支持 TinaCloud 托管服务或自托管(Cloudflare Workers、Vercel/Netlify Functions、AWS Lambda),多种认证方式。

框架支持:最佳为 Next.js(App Router 与 Pages Router),也支持 React、Astro(可视化编辑为实验性)、Gatsby、Hugo、Jekyll、Remix、11ty;非 React 框架仅支持侧边栏编辑。当前版本 tinacms 2.9.0、@tinacms/cli 1.11.0,React 支持 19.x(>=18.3.1 <20.0.0)。

使用方式:以 Next.js 为例,运行 npx @tinacms/cli@latest init,将公共资源目录设为 public,修改 package.json 脚本为 tinacms dev -c "next dev" 与 tinacms build && next build,配置 NEXT_PUBLIC_TINA_CLIENT_ID 与 TINA_TOKEN 环境变量,访问 http://localhost:3000/admin/index.html。数据获取使用 tina/generated/client 与 useTina 钩子实现可视化编辑。Vite+React、Astro 及框架无关项目有各自初始化与脚本配置方式。

适用场景:博客、文档站、营销站、作品集等;需要非技术编辑参与、希望用 Git 工作流与 PR 审阅内容、需要可视化编辑时。

限制:不适合需要多人实时协作编辑(应选 Sanity、Contentful、Firebase)或高度动态数据(如电商库存、实时仪表盘,应使用传统数据库)的场景;可视化编辑仅限 React;框架无关集成需手动配置且仅侧边栏编辑。常见问题包括 esbuild 编译错误(应精简 tina/config.ts 导入)与模块解析失败(可清理 node_modules 后重装)。