mcpField
D
datocms-plugin-scaffold

datocms-plugin-scaffold

github.com/datocms开发3110 次安装2 周前更新
代码仓库

关于 datocms-plugin-scaffold

datocms-plugin-scaffold 是用于创建最小可用 DatoCMS 插件初版的技能，面向插件开发者，涵盖项目搭建与构建验证，并将后续修改交由 datocms-plugin-builder 处理。

主要功能

  1. 01搭建最小 DatoCMS 插件
  2. 02选择插件界面并规划设置
  3. 03采用 Vite 和 React 项目布局
  4. 04验证构建并说明本地安装
  5. 05将后续插件工作转交其他技能

适用场景

  1. 01启动新的私有或市场插件
  2. 02添加插件的首个界面
  3. 03先建立可运行的脚手架再继续修改

安装

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

$npx skills add https://github.com/datocms/agent-skills --skill datocms-plugin-scaffold

安装后在 Claude Code 中输入/datocms-plugin-scaffold确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

agents/
openai.yaml
references/
project-scaffold.md
surface-starters.md

详细介绍

DatoCMS 插件脚手架

创建新插件的最小可用初版。保持初始脚手架精简，后续编辑交给 datocms-plugin-builder。

第 1 步：确认脚手架模式

静默检查当前目录。

检查是否已有插件（package.json 中包含 datocms-plugin-sdk、有 connect() 入口点和 Vite 配置）。如果已有插件且请求是编辑插件，则切换到 datocms-plugin-builder。先推断起始界面，再提问。

第 2 步：只询问缺少的必要信息

仅在不明确时询问：

  • 插件/文件夹名称
  • 私有插件还是市场插件
  • 初始界面/目标范围（如果会影响脚手架）
  • 是否需要 currentUserAccessToken/外部 API

如果已经明确，则跳过。

第 3 步：加载少量参考资料

加载：

  • references/project-scaffold.md
  • references/surface-starters.md

用于首次实现。扩展/维护工作交给 datocms-plugin-builder。

第 4 步：搭建项目脚手架

在当前工作目录中创建插件目录。使用 references/project-scaffold.md 中的 Vite/React 布局。仅添加所需的入口点。私有插件的元数据保持精简。市场插件需设置 npm 名称、关键词、主页和权限。仅添加必需的可选依赖。验证前先安装依赖。

第 5 步：接入首个界面

使用 references/surface-starters.md 编写声明、渲染和执行钩子。

注意事项：

  • 仅使用一个顶层 connect()
  • 使用 <Canvas ctx={ctx}> 包裹 UI；页面、检查器和全宽侧边栏使用 noAutoResizer
  • 对按 ID 分发的渲染钩子使用 switch
  • SDK 类型使用 import type { ... }
  • 确保 ctx.openModal() 参数和 ctx.resolve() 的内容可序列化为 JSON
  • 模块化内容/单个区块/结构化文本不要使用编辑器字段扩展
  • 以最小可用初版为限

第 6 步：验证

使用选定的包管理器安装依赖。运行构建。告知用户开发命令以及安装本地插件的方法。指出最重要的一项界面手动检查。

跨技能路由

  • 现有插件维护 -> datocms-plugin-builder
  • 原生 UI 设计/布局重设样式 -> datocms-plugin-design-system
  • 独立 CMA 脚本/模式工作 -> datocms-cma

评论

支持 Markdown