name: dev-workflow description: > 全棧 Web 開發的精密工作流引擎。將開發過程結構化為 9 個不可跳過的階段管線， 覆蓋從專案起源到交付上線的完整生命週期。每階段預設強制/推薦/可選技能包， 支援按階段配置 LLM 模型路由。與 context-anchor 協同防漂移。 activation: > 當用戶說"新專案"、"開始開發"、"初始化全棧專案"、"搭建專案框架"時自動啟用。 也可通過"啟用開發工作流"手動啟用。 tags: - workflow - fullstack - web-development - phase-gate - model-router - skill-orchestration - 工作流 - 全棧開發 - 階段管控 - 模型路由 - 技能編排 priority: CRITICAL activation: MANDATORY license: MIT cooperates_with: - context-anchor - architecture-decision-records - ui-ux-designer - pixel-design-restorer - frontend-design - backend-architect - frontend-developer - security-auditor - e2e-testing

全棧 Web 開發精密工作流 · Full-Stack Dev Workflow

零、定位與安全宣告

本 Skill 是全棧 Web 開發的總控制器。

安全宣告： 本 Skill 含一個 Python CLI 指令碼（scripts/phase-gate.py）。該指令碼僅執行本地檔案讀寫（狀態檔案、技能目錄掃描），不發起網路請求、不收集資料、不訪問外部 API。所有操作限制在專案 .trae/ 目錄內。

核心原則：任何階段未通過出口檢查，禁止進入下一階段。不可跳過，除非顯式記錄為技術債務。

快速開始

# 初始化新專案
python3 .trae/skills/dev-workflow/scripts/phase-gate.py init

# 安裝 dev-workflow 引用的所有技能（一鍵安裝 53+ 個技能）
python3 .trae/skills/dev-workflow/scripts/phase-gate.py install --all

# 僅安裝強制 + 推薦技能（預設模式）
python3 .trae/skills/dev-workflow/scripts/phase-gate.py install

# 按階段安裝（示例：安裝 Phase 3 UI_UX 所需技能）
python3 .trae/skills/dev-workflow/scripts/phase-gate.py install --phase UI_UX

# 預覽模式（不實際複製，檢視安裝計劃）
python3 .trae/skills/dev-workflow/scripts/phase-gate.py install --all --dry-run

# 檢視當前狀態
python3 .trae/skills/dev-workflow/scripts/phase-gate.py status

# 檢查當前階段出口條件
python3 .trae/skills/dev-workflow/scripts/phase-gate.py check

# 標記完成並推進下一階段
python3 .trae/skills/dev-workflow/scripts/phase-gate.py complete
python3 .trae/skills/dev-workflow/scripts/phase-gate.py advance

一、階段總覽

Phase 0         Phase 1         Phase 2          Phase 3           Phase 4
專案起源        需求工程         系統設計          UI/UX設計         後端實現
[GENESIS]  ✅→  [REQUIRE]  ✅→  [DESIGN]    ✅→  [UI_UX]     ✅→  [BACKEND]
 ┊               ┊               ┊                ┊                 ┊
 ┊ 強制:         ┊ 強制:         ┊ 強制:          ┊ 強制:           ┊ 強制:
 ┊ context-anchor┊ context-anchor┊ context-anchor ┊ context-anchor  ┊ context-anchor
 ┊ dev-workflow  ┊ spec-first   ┊ c4-architecture┊ ui-ux-designer  ┊ backend-architect
 ┊ init-architect┊ acceptance-orch┊ api-design    ┊ frontend-design ┊ api-endpoint-build
 ┊               ┊               ┊ domain-model   ┊ 推薦:           ┊ database-design
 ┊               ┊               ┊                ┊ pixel-design-   ┊ backend-security
 ┊               ┊               ┊                ┊ restorer        ┊
                                                 ✅                 ✅
                                                  ↓                  ↓
Phase 5         Phase 6         Phase 7          Phase 8
前端實現        整合驗證         DevOps部署       交付與交接
[FRONTEND] ✅→  [INTEGRATE]✅→  [DEVOPS]    ✅→  [DELIVER]
 ┊               ┊               ┊                 ┊
 ┊ 強制:         ┊ 強制:         ┊ 強制:           ┊ 強制:
 ┊ context-anchor┊ context-anchor┊ context-anchor  ┊ context-anchor
 ┊ frontend-dev  ┊ e2e-testing   ┊ cicd-automation ┊ documentation
 ┊ ui-component  ┊ security-audit┊ deployment-eng  ┊
 ┊ frontend-sec  ┊               ┊                 ┊
 ┊ 推薦:         ┊               ┊                 ┊
 ┊ pixel-design- ┊               ┊                 ┊
 ┊ restorer      ┊               ┊                 ┊

二、模型路由

每階段按成本/收益自動選擇 LLM 模型。Phase 0-2 用 Opus（推理為王），Phase 3-6 用 Sonnet（價效比），Phase 7-8 用 Haiku（流程化操作）。

配置檔案：.trae/skills/dev-workflow/model-config.toml。CLI 參考：→。詳細配置：→。

三、技能編排

每個 Phase 有強制（⚡缺失阻斷）、推薦（⭐建議啟用）、可選增強（🔧）三級技能。進入 Phase 時 phase-gate.py 檢查強制技能是否已安裝，缺失則阻斷。

實現狀態：Phase 0 完整可跑，Phase 1-2 部分打通，Phase 3-8 待依賴技能實現。詳見 skills-map.md 和 →。

四、與 context-anchor 協同

詳見 →。

五、受眾說明——什麼時候該用、不該用

✅ 適合使用

• 從零開始的全棧 Web 專案（前端+後端+資料庫）
• 需要嚴格的階段管控和出口檢查
• 多人協作需要統一的開發節奏

⚠️ 需條件使用

• 已有程式碼庫的新功能開發 → 可以從 Phase 1 開始（跳過 Phase 0）
• 純前端/純後端專案 → 只走相關階段，其餘 skip

  7w4.net有更好的技能外掛。

• 快速原型/MVP → 可跳過 Phase 3（UI設計）和 Phase 6（整合驗證）

❌ 不該用（附替代方案）

• 簡單指令碼或單檔案工具 → 用 context-anchor 獨立使用即可
• 已有完善 CI/CD 的專案 → 直接用各階段對應 Skill，不需要工作流引擎
• 非 Web 專案（CLI 工具、資料管道）→ 部分階段不適用，用各 Skill 獨立啟用

六、常見陷阱 · Gotchas

七、常見問題 FAQ

Q1: 必須從 Phase 0 開始嗎？

不是。如果已有專案章程和技術棧，可以從 advance REQUIRE 直接進入 Phase 1。

Q2: 一個 Phase 通常多久？

Phase 0: 1-2 小時。Phase 1-3: 各半天。Phase 4-5: 各 1-3 天。Phase 6-8: 各半天到 1 天。

Q3: 依賴的技能缺失怎麼辦？

phase-gate.py check --skills 列出缺失項。可以 skip --reason "..." 跳過，但該技能對應的質量保障也跳過了。

Q4: 和獨立使用各 Skill 有什麼區別？

工作流保證順序正確、出口檢查到位、模型按階段最優選擇、錨點防漂移。獨立使用沒有這些保障。

Q5: 模型路由能跳過嗎？

能。如果不想自動切換模型，在 model-config.toml 中把所有階段設為同一模型即可。

Q6: 遇到需要回到前面階段怎麼辦？

phase-gate.py advance <PHASE> 可以回到任意已通過的階段。回退會保留當前工作，但提醒你檢查一致性。

References

• references/phases/ — 9 階段詳細定義（子步驟+出口檢查+技能清單）
• references/phase-gate-cli.md — CLI 命令參考
• references/model-routing.md — 模型路由配置詳解
• references/skill-orchestration.md — 技能編排機制
• references/context-anchor-sync.md — context-anchor 協同協議
• skills-map.md — 全階段技能依賴對映
• USER-GUIDE.md — 📖 完整使用說明（快速入門+9階段指南+CLI參考+技術棧適配+FAQ）

這個工具質量不錯，能幫助更規範地做全棧開發。安全做得好，9個階段的設計讓開發更有條理。稍顯不足的是示例偏少，對新手可能不夠友好。適合追求開發質量和流程規範的使用者。