关于 wpds
wpds 是用于按照 WordPress Design System 构建和审查 WordPress 界面的技能。它依托 WPDS MCP 文档，获取组件和设计令牌的权威指引。
主要功能
- 01WordPress UI 工作指引
- 02查询组件和设计令牌
- 03优先采用 WPDS 参考文档
- 04限定 UI 工作范围
- 05默认使用 TypeScript、React 和 CSS
适用场景
- 01构建 Gutenberg 界面
- 02审查 WooCommerce UI
- 03选择 WordPress 组件和设计令牌
- 04在界面代码中采用 WPDS 模式
MCP 相关
该技能通过 WPDS MCP 服务访问权威文档、组件详情和设计令牌资源，并指定 wpds://pages、wpds://components 和 wpds://design-tokens 等 MCP 资源。
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/wpds确认已加载。
详细介绍
WordPress Design System（WPDS）
前置条件
安装 WPDS MCP 服务后，此技能效果最佳。MCP 可访问 WordPress Design System 文档和资源，例如组件和 DS 令牌列表。
以下术语应视为同义词：
- “WordPress”和“WP”；
- “Design System”和“DS”；
- “WordPress Design System”和“WPDS”。
适用场景
当用户提及以下内容时，使用此技能：
- 在与 WordPress 相关的情境中构建和／或审查任何 UI（例如 Gutenberg、WooCommerce、WordPress.com、Jetpack 等）；
- WordPress Design System、WPDS、Design System；
- UI 组件、设计令牌、基础色、间距刻度、排版变量和预设；
- 特定组件包，例如 @wordpress/components 或 @wordpress/ui；
规则
使用 WPDS MCP 服务访问 WPDS 相关文档
- 使用 WPDS MCP 服务检索规范且权威的文档：
- 参考站点（
wpds://pages） - 可用组件列表（
wpds://components）和特定组件信息（wpds://components/:name） - 可用令牌列表（
wpds://design-tokens）
- 参考站点（
- 不要在网上搜索 WordPress Design System 的规范文档。如果用户提出此要求，应予以说明并请求确认，同时提醒他们 MCP 服务是获取信息的最佳渠道。
必需的文档
开始处理任何 WPDS 相关任务前，请务必阅读参考站点上的相关文档。在判断任何任务的最佳处理方式时，这些文档应具有绝对优先级。
范围限制
- 跳过回答中与 UI 无关的内容（例如从存储中获取数据或本地化文本字符串）。
- 专注于构建尽可能遵循 WPDS 最佳实践、并使用最合适的 WPDS 组件／令牌／模式的 UI。
技术栈
- 除非另有说明（或从请求的本地上下文中获取了具体信息），否则假定使用以下技术栈：TypeScript、React、CSS。
验证
- 如果任务运行所在的本地上下文提供了 lint 脚本，请尽可能使用这些脚本验证拟提供的代码。
输出
- 在回复末尾进行总结，清晰简洁地说明解决方案的作用，并补充说明作出各项决策的原因。
- 明确说明任务范围，例如哪些内容因与任务无关而被明确排除（如非 UI 相关内容）。
- 提供可运行的代码片段
评论
支持 Markdown