sharepoint/spfx-dev-skills
Developer toolsこのページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。 原文を見る
Agents and skills for building SPFx solutions
概要
Agent skills for building solutions — scaffold, design, build, upgrade, and ship, all from your AI coding agent. 🚧 — 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. A single, focused skill — — that routes an agent to the right playbook based on what you ask. Each reference is a self-contained, agent-ready guide. SPFx development covers a lot of ground — the Yeoman generator, the toolchain switch from gulp to 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 , , , defaults to for data, and before calling a task done.
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