[][license-url] [][issues-url] [][stars-url]

目录

1. 关于本项目
   • 构建工具
   • 目录结构
2. 快速开始
   • 前置条件
   • 安装说明
3. 用法
4. 开发流程
5. 路线图
6. 贡献
7. 维护者
8. 开源协议
9. 联系方式
10. 致谢

## 关于本项目 Payload Kits 是一个采用 MIT 许可证的目录和 CLI 工具，用于将 Payload CMS 的 block kits 安装到受支持的 Payload v3 + Next.js 项目中。 普通的 `shadcn add` 只会复制文件。而 `payload-kit add` 还会在 Payload collection 中注册该 block，映射 renderer，重新生成类型，重新生成 admin import map，并记录安装状态，从而确保重复执行时的收敛性。 这个仓库既是： - 基于 Fumadocs 构建的 Next.js 网站，用于提供落地页、文档、目录、搜索、Open Graph 图片以及 AI 可读的文本界面。 - 同时也是 `payload-kit` registry 和 CLI，负责将可安装的 kits 分发到用户的 Payload 项目中。 这个仓库本身并不是一个 Payload CMS 运行时应用。该网站不需要 Payload admin routes、collections、globals、database adapter 或 `PAYLOAD_SECRET`。

(返回顶部)

### 构建工具 - [Next.js][next-url] - [React][react-url] - [Fumadocs][fumadocs-url] - [Payload CMS][payload-url] - [shadcn Registry][shadcn-url] - [TypeScript][typescript-url] - [Tailwind CSS][tailwind-url] - [Playwright][playwright-url] - [Vitest][vitest-url]

(返回顶部)

### 目录结构 | 路径 | 用途 | | ---------------------------- | ------------------------------------------------------------------------------------- | | `src/app` | Next.js app routes、主页、目录、文档、搜索、LLM 文本界面以及 OG 图片 | | `src/components/site` | 网站 UI、落地页版块、安装回放、kit 卡片以及演示副本 | | `src/lib/site.ts` | 落地页文案、kit 条目、FAQ 以及演示的集中式文案/数据源 | | `content/docs` | Fumadocs MDX 文档 | | `payload-kits/registry.json` | shadcn registry 源定义 | | `payload-kits/source` | 发送到用户仓库的 Payload 目标源文件 | | `payload-kits/manifests` | 安装元数据、fragments、安装后任务以及恢复契约 | | `tools/payload-kit` | `payload-kit add` 的 CLI 实现 | | `bin/payload-kit.mjs` | CLI 可执行文件入口点 | | `tests` | Playwright E2E 和 Vitest 集成测试覆盖 |

(返回顶部)

## 快速开始 请按照以下步骤在本地运行文档站点和 registry 工具。 ### 前置条件 - Node.js `^20.19.0 || >=22.12.0` - pnpm `^9 || ^10` ### 安装说明 1. 克隆仓库。 git clone https://github.com/Ducksss/payload-components.git cd payload-components 2. 安装依赖。 pnpm install --frozen-lockfile --ignore-workspace 3. 构建 Fumadocs 源缓存。 pnpm source:build 4. 启动开发服务器。 pnpm dev 5. 打开 [http://localhost:3000](http://localhost:3000)。

(返回顶部)

## 用法 将一个 kit 安装到受支持的 Payload v3 + Next.js 项目中： ``` npx payload-kit add hero-basic npx payload-kit add feature-grid-basic ``` 安装程序会执行五个幂等阶段： 1. 构建公共 registry 输出。 2. 通过 shadcn registry 添加 kit 文件。 3. 安装所需依赖。 4. 应用 Payload fragments 以进行 collection 注册和 renderer 映射。 5. 运行用于生成类型和 admin import map 的安装后脚本。 生成的安装状态会写入到用户项目内的 `.payload-kit/state.json` 中。 实用的本地路由： - `/` - 产品和文档主页 - `/docs` - Fumadocs 文档 - `/components` - kit 目录 - `/api/search` - Fumadocs 搜索 endpoint - `/llms.txt` 和 `/llms-full.txt` - AI 可读的项目摘要 - `/r/registry.json` - 生成的公共 registry

(返回顶部)

## 开发流程 构建生产环境应用。prebuild 步骤会重新生成 Fumadocs 源缓存和公共 registry。 ``` pnpm build ``` 检查生成的 registry 输出是否可重现： ``` pnpm test:registry ``` 在发布重大更改之前，运行完整的发布检测： ``` pnpm test:release ``` 对于针对性的工作，请优先运行最小且有效的检查： ``` pnpm lint pnpm source:build pnpm exec tsc --noEmit pnpm test:registry pnpm run test:int pnpm run test:e2e pnpm build ``` 当端口 `3000` 被占用时，请使用 `E2E_PORT=3100 pnpm run test:e2e`。

(返回顶部)

## 路线图 本项目始终坚持以社区为先：为真正的 Payload 项目提供更多 kits、更强的安装恢复能力、更清晰的文档以及更好的兼容性覆盖。 查看 [ROADMAP.md](./ROADMAP.md) 和 [开放议题](https://github.com/Ducksss/payload-components/issues) 以了解正在进行的工作。

(返回顶部)

## 维护者 Payload Kits 由 [Ducksss](https://github.com/Ducksss) 维护。 安全报告应使用此仓库的 GitHub Security Advisories。

(返回顶部)

## 开源协议 基于 MIT 许可证分发。请查看 [LICENSE](./LICENSE) 获取更多信息。

(返回顶部)

## 联系方式 - 网站：[payload-components.xyz](https://payload-components.xyz) - 议题：[github.com/Ducksss/payload-components/issues][issues-url] - 仓库：[github.com/Ducksss/payload-components][repo-url]

(返回顶部)

## 致谢 - [Best-README-Template][best-readme-template-url] 提供的 README 结构。 - [Payload CMS][payload-url] 提供的目标 CMS 生态系统。 - [shadcn][shadcn-url] 提供的 registry 模型，Payload Kits 正是建立在其之上。 - [Fumadocs][fumadocs-url] 提供的文档站点基础。

(返回顶部)

标签：Payload CMS, Syscall, Web开发, 内容管理系统, 特征检测, 组件库, 自动化攻击