mcpField
F
fumadocs-registry-integration

fumadocs-registry-integration

github.com/theorcdev开发2.1k83 次安装2 天前更新
代码仓库

关于 fumadocs-registry-integration

fumadocs-registry-integration 说明如何在 registry.json 中登记 8-bit 组件和预构建区块,面向维护组件注册表的开发者。内容涵盖分类、依赖、文件路径及通过 shadcn 命令行安装测试。

主要功能

  1. 01组件与区块的条目范式
  2. 02登记必需的 retro.css 文件
  3. 03分类和依赖项说明
  4. 04源路径与目标路径约定
  5. 05命令行安装测试步骤

适用场景

  1. 01登记可复用的 8-bit 组件
  2. 02添加预构建游戏界面区块
  3. 03准备通过 shadcn 命令行安装的组件

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/theorcdev/8bitcn-ui --skill fumadocs-registry-integration

安装后在 Claude Code 中输入/fumadocs-registry-integration确认已加载。

详细介绍

注册表集成

在 registry.json 中注册 8-bit 组件,以便通过 shadcn add @8bitcn/[component-name] 发现。

组件条目模式
{
  "name": "button",
  "type": "registry:component",
  "title": "8-bit Button",
  "description": "A simple 8-bit button component",
  "registryDependencies": ["button"],
  "files": [
    {
      "path": "components/ui/8bit/button.tsx",
      "type": "registry:component",
      "target": "components/ui/8bit/button.tsx"
    },
    {
      "path": "components/ui/8bit/styles/retro.css",
      "type": "registry:component",
      "target": "components/ui/8bit/styles/retro.css"
    }
  ]
}
区块条目模式

对于游戏 UI 等预构建布局:

{
  "name": "quest-log",
  "type": "registry:block",
  "title": "8-bit Quest Log",
  "description": "An 8-bit quest and mission tracking system.",
  "registryDependencies": ["card", "accordion"],
  "categories": ["gaming"],
  "files": [
    {
      "path": "components/ui/8bit/quest-log.tsx",
      "type": "registry:block",
      "target": "components/ui/8bit/quest-log.tsx"
    },
    {
      "path": "components/ui/8bit/styles/retro.css",
      "type": "registry:component",
      "target": "components/ui/8bit/styles/retro.css"
    }
  ]
}
必需的 retro.css

始终在 files 数组中包含 retro.css:

"files": [
  {
    "path": "components/ui/8bit/new-component.tsx",
    "type": "registry:component",
    "target": "components/ui/8bit/new-component.tsx"
  },
  {
    "path": "components/ui/8bit/styles/retro.css",
    "type": "registry:component",
    "target": "components/ui/8bit/styles/retro.css"
  }
]
分类

游戏组件请使用游戏专属分类:

"categories": ["gaming"]

可用分类:gaming、layout、form、data-display、feedback、navigation、overlay。

注册表依赖项

列出基础 shadcn 依赖项(不是 8-bit 版本):

"registryDependencies": ["button", "dialog", "progress"]

对于包含多个组件的区块:

"registryDependencies": ["card", "button", "progress", "tabs"]
类型选择

registry:component - 单个可复用组件:

{
  "type": "registry:component",
  "files": [...]
}

registry:block - 预构建布局或功能:

{
  "type": "registry:block",
  "categories": ["gaming"],
  "files": [...]
}
完整示例
{
  "name": "health-bar",
  "type": "registry:component",
  "title": "8-bit Health Bar",
  "description": "An 8-bit health bar component for game UI.",
  "registryDependencies": ["progress"],
  "files": [
    {
      "path": "components/ui/8bit/health-bar.tsx",
      "type": "registry:component",
      "target": "components/ui/8bit/health-bar.tsx"
    },
    {
      "path": "components/ui/8bit/progress.tsx",
      "type": "registry:component",
      "target": "components/ui/8bit/progress.tsx"
    },
    {
      "path": "components/ui/8bit/styles/retro.css",
      "type": "registry:component",
      "target": "components/ui/8bit/styles/retro.css"
    }
  ]
}
核心原则
  1. 类型 - 单个组件使用 registry:component,布局使用 registry:block
  2. 必需的 retro.css - 始终在 files 数组中包含
  3. 目标路径 - 源路径和目标路径相同
  4. 分类 - 复古风格区块使用 gaming
  5. 依赖项 - 列出基础 shadcn/ui 组件(不是 8-bit 组件)
  6. 描述 - 简洁明了,适合 CLI 输出
  7. 文件顺序 - 组件在前,retro.css 在后
添加新组件
  1. 在 components/ui/8bit/component.tsx 中创建组件
  2. 在 content/docs/components/component.mdx 中创建文档
  3. 在 registry.json 中添加条目:
    • 复制现有组件作为模板
    • 更新名称、标题和描述
    • 设置正确的 registryDependencies
    • 在 files 中包含 retro.css
  4. 测试:pnpm dlx shadcn@latest add @8bitcn/component
参考
  • registry.json - 完整组件注册表
  • content/docs/components/*.mdx - 组件文档

评论

支持 Markdown