Windsurf 整合指南
在 Windsurf AI 中使用 Agent Skills 的詳細教學。
Windsurf AI 整合
Windsurf 是 Codeium 推出的強大 AI 原生 IDE，完全支援 Agent Skills 標準。本指南將幫助你在 Windsurf 中設定和使用技能。
前置條件
- 已安裝 Windsurf IDE
- Node.js 18+ 和 npm/pnpm
安裝方式
方式一：CLI 命令安裝
使用全域 CLI 安裝技能：
npx agent-skills install expo/skills/building-native-ui技能將自動在你的 Windsurf 工作區中可用。
方式二：Cascade（Agent 模式）
Windsurf 的 Cascade 功能可以直接使用技能設定。在 Cascade 聊天中：
-
輸入你的請求並提及技能：
使用 expo-native-ui 技能，幫我構建一個標籤頁導航 -
Cascade 會自動獲取並應用技能上下文。
方式三：專案級設定
在專案的 .windsurf/skills.json 中添加技能：
{
"skills": [
"vercel-labs/agent-skills/vercel-react-best-practices",
"expo/skills/building-native-ui"
]
}開啟專案時，Windsurf 會自動載入這些技能。
在 Cascade 中使用技能
Windsurf 的 Cascade（AI Agent）模式非常適合複雜任務：
@cascade 使用 react-best-practices 技能，重構我的元件以遵循 Vercel 規範Cascade 會：
- 載入技能的知識庫
- 分析你的程式碼
- 應用技能的模式和建議
Windsurf 熱門技能推薦
| 技能 | 用途 | 安裝命令 |
|---|---|---|
| Building Native UI | React Native / Expo 開發 | expo/skills/building-native-ui |
| Expo Deployment | 應用商店部署 | expo/skills/expo-deployment |
| Monorepo 最佳實踐 | 大型程式碼庫管理 | jaredpalmer/skills/monorepo-best-practices |
| Better Auth | 身份驗證實現 | better-auth/skills/better-auth-best-practices |
Windsurf vs Cursor：主要區別
| 功能 | Windsurf | Cursor |
|---|---|---|
| Agent 模式 | Cascade（串流） | Composer |
| 技能載入 | Cascade 中自動載入 | 需手動設定 |
| 多檔案編輯 | 原生支援 | 透過 Composer |
| 上下文視窗 | 擴展型（100K+） | 標準型 |
常見問題
技能在 Cascade 中無法載入？
- 啟用 Flow 模式：確保你在 "Flow" 或 "Agent" 模式下使用 Cascade。
- 檢查網路：技能從 GitHub 獲取，確保網路暢通。
- 重新啟動 Windsurf：有時重啟可以解決問題。
效能問題
如果技能拖慢了你的工作流程：
# 清除技能快取
npx agent-skills clear-cache
# 列出已安裝的技能
npx agent-skills list
# 移除不用的技能
npx agent-skills remove <skill-name>