构建SPFx解决方案的代理与技能
概览
构建解决方案的代理技能——架构、设计、建造、升级和运输，全部由你的AI编码代理完成。 🚧 —— 期待变化。技能名称、文件布局和指导只是起点，会不断演变。输出是建议，而非权威答案;在提交或发布前请先审查。 一项专注的技能——根据你所询问的内容，引导经纪人找到合适的操作手册。每个参考资料都是自成一体、为经纪人准备的指南。 SPFx开发涵盖了广泛领域——如Yeoman生成器、工具链从gulp切换到1.22版本、Fluent UI主题、无障碍功能，以及针对SharePoint和Microsoft Graph的数据访问。AI代理在通用网页上下文中工作时，往往混合工具链版本，运行挂在终端的交互提示，发明包版本，或在验证构建前停止。这项技能使代理始终处于SPFx通道中：数据默认为it ， ， ， ，在调用任务完成前。
概述（AI 翻译）
构建**SharePoint框架（SPFx）**解决方案的代理技能——架构、设计、构建、升级和交付，全部由你的AI编码代理完成。
🚧 预览——预计会有变化。技能名称、文件布局和指导只是起点，会不断调整。输出是建议，而非权威答案;在提交或发布前请先审查。
这个收回里有什么
一个单一、专注的技能——spfx——根据你所询问的内容，引导特工找到合适的操作手册。每个参考资料都是自成一体、适合特工使用的指南。
技能：spfx
| 能力 | 想用的时候用… | 参考资料 |
|---|---|---|
| 创建搭建新的网页部分、扩展、库或ACE | create.md | |
| 升级将项目迁移到更新的SPFx版本 | upgrade.md | |
| React 设计 | 使用 Fluent UI v9 构建或更改 UI | react-design.md |
| 工具链 | 拨片重量（v1.22+）或吞咽（≤ v1.21.1） | SKILL.md |
| PnPjs 数据 | 读取或写入 SharePoint / Microsoft 图数据 | pnpjs.md |
为什么有这些技能？
SPFx的开发涵盖了很多领域——Yeoman生成器，v1时从gulp切换到Heft的工具链。
本页由 AI 翻译，技术细节请以原文为准。
README
以下为原文 README 节选，完整内容请查看原文。
SPFx Dev Skills
Agent skills for building SharePoint Framework (SPFx) solutions — scaffold, design, build, upgrade, and ship, all from your AI coding agent.
🚧 Preview — expect changes. Skill names, file layout, and guidance are a starting point and will evolve. Outputs are suggestions, not authoritative answers; review them before committing or shipping.
What’s in this repo
A single, focused skill — spfx — that routes an agent to the right playbook based on what you ask. Each reference is a self-contained, agent-ready guide.
plugins/spfx/skills/spfx/
SKILL.md Router + global rules + the Heft/gulp toolchain decision rule
references/
create.md Scaffold web parts & extensions (Yeoman, Heft by default)
upgrade.md Version upgrades (CLI for Microsoft 365) + gulp → Heft migration
react-design.md Fluent UI v9 UI contract — theming, accessibility, host-aware layout
pnpjs.md PnPjs as the default data layer for SharePoint & Microsoft Graph
The skill: spfx
| Capability | Use it when you want to… | Reference |
|---|---|---|
| Create | Scaffold a new web part, extension, library, or ACE | create.md |
| Upgrade | Move a project to a newer SPFx version | upgrade.md |
| React Design | Build or change UI with Fluent UI v9 | react-design.md |
| Toolchain | Pick Heft (v1.22+) or gulp (≤ v1.21.1) | SKILL.md |
| PnPjs Data | Read or write SharePoint / Microsoft Graph data | pnpjs.md |
Why these skills?
SPFx development covers a lot of ground — the Yeoman generator, the toolchain switch from gulp to Heft at v1.22, Fluent UI theming, accessibility, and data access against SharePoint and Microsoft Graph. AI agents working from generic web context tend to mix toolchain versions, run interactive prompts that hang in a terminal, invent package versions, or stop before validating a build. This skill keeps the agent in the SPFx lane end-to-end: it detects the installed version, picks the correct toolchain, uses non-interactive commands, defaults to PnPjs for data, and validates with a clean build before calling a task done.
The guidance is informed by repeated evaluation of an SPFx 1.21.1-to-1.22.2 upgrade scenario. Read Behind SPFx Dev Skills: testing what agents know and fixing what they miss for the baseline, scoring, and resulting changes to the skill, SPFx documentation, and agent content retrieval.
Use cases
推荐工具
换一个关键词，或者移除筛选条件。
安装
npx skillfish add sharepoint/spfx-dev-skills