Agent Skills
返回列表
💻

WordPress Gutenberg 区块生成器

开发编程 更新于 2026.08.29

将以下提示词粘贴到你的 AI 对话框中:

请根据 https://skillhub.cn/install/skillhub.md,安装 @user_3c6cb52e/wordpress-gutenberg-block-generator

技能介绍

问题背景

手动搭建一个自定义 Gutenberg 区块,意味着要在 block.json、package.json、编辑与保存组件、PHP 注册代码之间反复切换,容易遗漏 useBlockProps、InspectorControls 的接入点,或者写错 register_block_type 的元数据映射。这类脚手架工作本身不复杂,但十分耗时,尤其对刚接触区块开发的同学来说,一开始很难搞清楚该生成哪些文件、API 如何对应。

核心能力与关键步骤

该技能围绕 @wordpress/create-block CLI 与 block.json schema 组织脚手架流程:

  • 初始化标准插件目录,生成 block.json、package.json 等基础文件
  • 生成 edit.js / save.js,其中包含 InspectorControls 和 useBlockProps 的接入位置
  • 通过 PHP 端 register_block_type 完成区块注册,保持 schema 与运行时一致
  • 输出可分发的区块插件骨架,避免手写 boilerplate 带来的结构偏差

整个过程强调用官方 CLI 和 schema 作为唯一事实来源,减少自己拼装元数据的风险。

适用边界与注意点

适合需要从零开始创建区块插件、又不想逐文件手写脚手架的场景。它不替代对 Gutenberg 生命周期的理解:生成的组件仍需要开发者自行补充状态管理、样式加载和可访问性处理。资料中没有给出自动提取的安装或使用说明,在敏感流程中运行前,建议先阅读上游仓库说明,确认依赖版本与当前 WordPress 版本的兼容性。

使用场景

  • 接手 WordPress 站点,需要为业务需求新增一个自定义区块插件
  • 已有主题但缺少专属区块,想快速生成可分发的插件骨架
  • 手工写区块元数据容易出错,需要按 block.json schema 生成标准结构
  • 需要生成包含 InspectorControls 和 useBlockProps 的 edit/save 组件起点

适合人员

  • 开发 WordPress 插件的工程师,想跳过手写脚手架直接进入业务逻辑
  • 维护自建主题的前端开发者,需要为区块编辑器补齐自定义组件
  • 第一次写 Gutenberg 区块的开发者,希望按官方 CLI 生成标准文件结构
  • 需要交付区块插件给非技术团队使用的开发者,要保证目录结构可分发