團隊從 5 人擴充套件到 20 人，AI 工具在知識傳遞、程式碼一致性、新人 onboarding 方面起了很大作用。來分享實際策略。

團隊擴充套件的挑戰

5 人團隊：溝通成本低，程式碼風格靠默契
15 人團隊：需要規範，但規範執行靠人工
20 人團隊：靠 AI 做強制執行 + 知識庫

AI 解決的問題：
  1. 程式碼風格不一致 → AI review 強制執行
  2. 新人上手慢 → AI 輔助 onboarding
  3. 知識分散 → AI 知識庫
  4. 重複造輪子 → AI 推薦已有方案

策略一：團隊 Prompt 庫

# prompts/component-creation.yaml
name: 建立新元件
description: 按團隊規範建立新的 React 元件
template: |
  建立元件 {{componentName}}，要求：
  1. 使用 TypeScript，嚴格模式
  2. 使用 cva 管理 variant
  3. 使用 forwardRef
  4. 配套 Storybook stories
  5. 配套單元測試（vitest + testing-library）
  6. 放在 src/components/{{componentName}} 目錄
  7. 遵循團隊 naming convention：PascalCase 元件，camelCase props
  8. 匯出型別定義
variables:
  - name: componentName
    description: 元件名稱
    required: true

# prompts/api-integration.yaml
name: API 整合
description: 按團隊規範建立 API 整合程式碼
template: |
  在 {{feature}} 模組中整合 {{apiEndpoint}} API：
  1. 使用 @tanstack/react-query 管理請求
  2. 建立 src/api/{{feature}}.ts 定義請求函式
  3. 建立 src/hooks/use{{Feature}}.ts 封裝 hook
  4. 新增 loading/error 狀態處理
  5. 使用 zod 驗證響應型別
  6. 新增樂觀更新（如適用）

策略二：AI 新人 Onboarding

// 新人第一天的 AI 工作流

// 1. AI 生成專案概覽
const onboardingGuide = await generateOnboardingGuide({
  projectName: "frontend-app",
  role: "frontend-engineer",
  techStack: ["react", "typescript", "tailwind", "next.js"],
});

// 2. AI 基於程式碼庫回答新人問題
// 新人在 Claude Code 中提問：
// "這個專案的認證流程是怎麼實現的？"
// "useAuth hook 在哪些地方被使用？"
// "如何新增一個新的 API 端點？"

// 3. AI 分配的練習任務
const practiceTasks = [
  {
    title: "修復一個 Good First Issue",
    description: "選擇一個標記為 good-first-issue 的 ticket",
    aiSupport: "Claude Code 會幫助你理解相關程式碼",
  },
  {
    title: "新增一個簡單的元件",
    description: "使用 AI prompt 庫建立一個 Button 元件",
    aiSupport: "AI 會按團隊規範生成初始程式碼",
  },
  {
    title: "寫一個單元測試",
    description: "為現有元件補充測試用例",
    aiSupport: "AI 會分析程式碼生成測試框架",
  },
];

策略三：程式碼一致性保障

// .claude/settings.json
{
  "rules": [
    {
      "pattern": "src/components/**/*.tsx",
      "rules": [
        "必須使用 TypeScript",
        "必須使用 forwardRef",
        "必須匯出 Props 型別",
        "使用 cn() 合併 className",
        "禁止使用 inline style"
      ]
    },
    {
      "pattern": "src/api/**/*.ts",
      "rules": [
        "必須使用 zod 驗證響應",
        "必須定義返回型別",
        "使用 react-query 管理快取",
        "錯誤處理必須返回 Result 型別"
      ]
    }
  ]
}

策略四：AI 知識庫

// scripts/knowledge-base.ts
// 將團隊的技術決策和最佳實踐存入 AI 可檢索的知識庫

interface KnowledgeEntry {
  id: string;
  title: string;
  content: string;
  tags: string[];
  lastUpdated: string;
  author: string;
}

const knowledgeBase: KnowledgeEntry[] = [
  {
    id: "state-management",
    title: "狀態管理選型",
    content: `我們使用：
      - 服務端狀態：@tanstack/react-query
      - 全域性 UI 狀態：Zustand
      - 表單狀態：React Hook Form
      - URL 狀態：nuqs
    不使用 Redux（過度設計）和 Context（效能問題）`,
    tags: ["architecture", "state-management"],
    lastUpdated: "2025-06-01",
    author: "tech-lead",
  },
  {
    id: "error-handling",
    title: "錯誤處理規範",
    content: `所有 API 呼叫必須：
      1. 使用 try-catch 包裹
      2. 返回 Result<T, E> 型別
      3. 上報到 Sentry
      4. 展示使用者友好的錯誤資訊
    禁止：靜默吞掉錯誤`,
    tags: ["error-handling", "best-practices"],
    lastUpdated: "2025-05-15",
    author: "tech-lead",
  },
];

團隊資料

引入 AI 後的團隊效率變化（6 個月跟蹤）：

新人上手時間：從 3 周降到 1.5 周
程式碼審查時間：減少 40%
程式碼風格不一致問題：減少 75%
重複造輪子事件：減少 60%
技術債務累積速度：降低 30%

小結

• 團隊擴充套件時，AI 不是錦上添花，是必需品
• 建立團隊 Prompt 庫，確保 AI 輸出符合團隊規範
• AI 輔助 onboarding 可以顯著縮短新人上手時間
• 程式碼一致性靠 AI review 強制執行，不靠人盯
• 知識庫的建設需要持續投入，但回報很高