任務技能（Skills）
Vercel Agent Skills
讓 AI 參考 Vercel 的前端開發經驗，檢查程式碼性能和界面體驗。
內容介紹
少裝一點整理 · 依據項目公開文件
這個技能包把前端開發和界面檢查的方法整理成 AI 可使用的任務說明。適合用 AI 開發 React、Next.js 項目，或檢查網頁性能、可存取性和使用體驗的開發者。可以按當前任務選擇相關技能，並通過 README 中的安裝方式加入支持 Skills 的助手；具體建議仍需要結合自己的項目判斷。
此任務使用的技能: web-design-guidelines
開始使用
先核對使用條件，再選擇你的 AI 助手查看接入步驟。
- 需要準備
- 可使用技能的 AI 助手。
- 使用官方 Skills CLI 時需要 Node.js 與 npm；只安裝需要的技能。
- 費用說明
- 項目程式碼開放原始碼；AI 助手的使用費用與第三方服務額度另計。
- 需要的權限
- 檢查類技能會讀取項目；部署類技能會打包並上傳項目。先選審查技能，發佈操作應單獨確認。Skills CLI 有匿名統計及關閉選項。
Codex需手動配置
項目使用 Skills CLI 安裝；需要在安裝時選對助手和技能。
接入步驟
- 打開 README 安裝章節及下方 Skills CLI 說明。
- 從 vercel-labs/agent-skills 選擇需要的技能，並將目標助手設為 Codex。
- 在助手內查看技能是否已出現；必要時重新打開會話。
怎樣確認接入有效
選 web-design-guidelines，讓它檢查一個頁面的鍵盤操作並指出具體位置。
官方依據
Claude Code需手動配置
項目使用 Skills CLI 安裝；需要在安裝時選對助手和技能。
接入步驟
- 打開 README 安裝章節及下方 Skills CLI 說明。
- 從 vercel-labs/agent-skills 選擇需要的技能，並將目標助手設為 Claude Code。
- 在助手內查看技能是否已出現；必要時重新打開會話。
怎樣確認接入有效
選 web-design-guidelines，讓它檢查一個頁面的鍵盤操作並指出具體位置。
官方依據
Cursor需手動配置
項目使用 Skills CLI 安裝；需要在安裝時選對助手和技能。
接入步驟
- 打開 README 安裝章節及下方 Skills CLI 說明。
- 從 vercel-labs/agent-skills 選擇需要的技能，並將目標助手設為 Cursor。
- 在助手內查看技能是否已出現；必要時重新打開會話。
怎樣確認接入有效
選 web-design-guidelines，讓它檢查一個頁面的鍵盤操作並指出具體位置。
官方依據
官方依據
接入說明核對於 2026-10-12 · 依據公開文件整理，未逐一安裝實測。
可以怎麼用
- 參考 React 與 Next.js 的性能實踐
- 檢查界面可存取性與使用體驗
- 按任務選擇並安裝相關技能
官方項目與文件
專案說明譯文
Vercel 官方 AI 助手技能集合
用途相近的外掛
優先匹配當前外掛的主要用途，再參考共同用途和收藏數；接入方法可能不同。
- Claude Code Official Plugins — 在 Claude Code 中按任務選用程式碼審查、前端設計和 MCP 開發等外掛。
- Codex Plugins & Built-in Tools — 尋找用於瀏覽器工作、編碼、設計、辦公室文件和影片的 Codex 功能及其實際設定要求。
- Vue Skills — 給 AI 補充 Vue 3 的開發、路由、狀態管理和測試參考。