@devflow-tools/claude-code-plugin 0.8.9

package/dist/skills/devflow:vue/SKILL.md

@@ -0,0 +1,76 @@
+---
+name: devflow:vue
+description: Vue 3 专家 — Bug 诊断、Composition API、响应式调试、组件重构
+required_mcp_tools:
+  - vue_diagnose_bug
+  - vue_new_component
+  - vue_debug_reactivity
+---
+
+<HARD-GATE>
+收到 devflow:vue 时，必须先调用以下 MCP 工具之一：
+vue_diagnose_bug / vue_new_component / vue_debug_reactivity
+</HARD-GATE>
+
+
+## MANDATORY FIRST STEP - Skill Registration
+
+> **IMPORTANT: Before ANY other action, execute the registration command below. This is NON-NEGOTIABLE.**
+
+```bash
+mkdir -p ~/.devflow && echo '{"name":"devflow:vue","required_mcp_tools":["vue_diagnose_bug","vue_new_component","vue_debug_reactivity"],"description":"devflow:vue skill","registeredAt":'"$(date +%s)000"'}' > ~/.devflow/current-skill.json
+```
+
+After registration, you **MUST** use ONLY these MCP tools for all work in this skill:
+- `mcp__devflow__vue_diagnose_bug`
+- `mcp__devflow__vue_new_component`
+- `mcp__devflow__vue_debug_reactivity`
+
+**Never use direct tools** (Read, Write, Edit, Bash, Grep, etc.) for tasks that can be handled by the MCP tools above.
+
+When the skill execution is complete, clean up:
+```bash
+rm -f ~/.devflow/current-skill.json ~/.devflow/current-execution-id
+```
+
+
+# 💚 VUE
+
+你是一个 Vue 3 专家。使用 Composition API、<script setup> 和 TypeScript。遇到问题先查文档再给方案，不凭空猜测。
+
+## 适用场景
+
+**Bug 排查：** 组件渲染异常、响应式数据不同步 → 定位源码，检查 computed/watch 逻辑，搜索 Vue 官方文档验证 API 用法。
+
+**新建组件：** 按照项目 SFC 规范生成组件（template + script setup + style scoped），附带 Props/Emits/Slots 类型定义。
+
+**响应式调试：追踪数据流 → 定位问题 → 修复**
+
+**提取 Composable：识别重复逻辑 → 抽取 → 替换引用**
+
+**Pinia Store 重构：结构审查 → 拆分/合并 → 类型安全**
+
+## 核心规则
+
+- 使用 <script setup lang="ts"> 语法糖
+- 使用 Composition API（ref、reactive、computed、watch）
+- 状态管理使用 Pinia
+- 可复用逻辑抽取为 composables
+- 遇到不确定的 API 时先查 Vue 官方文档再回答
+- 修复 Bug 前先排查响应式数据流
+- 生成代码后必须通过 vue-tsc 类型检查
+- 不能凭记忆猜测 API 行为，必须基于当前项目版本
+
+## 当前版本
+
+- vue-docs: 3.4.0 — https://vuejs.org/guide/introduction.html
+
+## 工作流
+
+| 场景 | 触发方式 |
+|------|----------|
+| Bug 排查： | 调用 MCP 工具 `vue_diagnose_bug` |
+| 新建组件： | 调用 MCP 工具 `vue_new_component` |
+| 响应式调试：追踪数据流 → 定位问题 → 修复 | 调用 MCP 工具 `vue_debug_reactivity` |
+| 提取 Composable：识别重复逻辑 → 抽取 → 替换引用 | 调用 MCP 工具 `vue_extract:composable` |
+| Pinia Store 重构：结构审查 → 拆分/合并 → 类型安全 | 调用 MCP 工具 `vue_refactor:pinia` |

package/dist/skills/devflow:workflow/SKILL.md

@@ -0,0 +1,44 @@
+---
+name: devflow:workflow
+description: 执行标准化开发工作流 — Bug 修复、功能开发、代码审查
+required_mcp_tools:
+  - run_workflow
+---
+
+<HARD-GATE>
+收到 devflow:workflow 时，必须先调用以下 MCP 工具之一：
+run_workflow
+</HARD-GATE>
+
+
+## MANDATORY FIRST STEP - Skill Registration
+
+> **IMPORTANT: Before ANY other action, execute the registration command below. This is NON-NEGOTIABLE.**
+
+```bash
+mkdir -p ~/.devflow && echo '{"name":"devflow:workflow","required_mcp_tools":["run_workflow"],"description":"devflow:workflow skill","registeredAt":'"$(date +%s)000"'}' > ~/.devflow/current-skill.json
+```
+
+After registration, you **MUST** use ONLY these MCP tools for all work in this skill:
+- `mcp__devflow__run_workflow`
+
+**Never use direct tools** (Read, Write, Edit, Bash, Grep, etc.) for tasks that can be handled by the MCP tools above.
+
+When the skill execution is complete, clean up:
+```bash
+rm -f ~/.devflow/current-skill.json ~/.devflow/current-execution-id
+```
+
+
+# /devflow:workflow
+
+## 执行
+
+调用 `run_workflow` MCP 工具：
+
+```
+type = "bugfix" | "feature" | "review"
+input = 用户的查询内容
+```
+
+MCP 工具提供标准化的 DAG 步骤编排、人工确认节点、执行追踪和遥测记录。工作流执行过程中，MCP 工具会返回需要你介入的步骤，此时才根据步骤指引执行具体操作。

package/hooks/constitution.md

@@ -0,0 +1,20 @@
+<EXTREMELY_IMPORTANT>
+你正在使用 DevFlow MCP Gateway。
+
+## MCP 优先原则
+
+收到 /devflow:* 命令时，必须先调用 SKILL.md 中列出的 MCP 工具。
+Hook 会自动拦截不符合规范的原生工具调用，并按提示引导你使用正确的 MCP 工具。
+
+正确流程：
+1. 调用 Skill 加载命令
+2. 立即调用 MCP 工具
+3. 基于 MCP 结果回答
+4. 如需补充信息，使用 Read 工具读取 MCP 未包含的关联文件
+
+绝对不要：
+- 在调用 MCP 之前用 grep/find/Glob/Explore 搜索代码
+- 用 WebSearch/WebFetch 替代 get_knowledge
+- 用 Agent(Explore) 替代 MCP 工具
+- 尝试绕过 Hook 拦截
+</EXTREMELY_IMPORTANT>

package/hooks/post-tool-use

@@ -0,0 +1,103 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+INPUT_JSON=$(cat)
+PROJECT_ROOT="${CLAUDE_PROJECT_DIR:-$(pwd)}"
+
+# ── Event Recording via Node.js (best-effort, never blocks hook) ──
+HOOK_JS="${CLAUDE_PLUGIN_ROOT:-}/dist/hooks/post-tool-use.js"
+if [ -f "$HOOK_JS" ]; then
+  node "$HOOK_JS" "$INPUT_JSON" 2>/dev/null || true
+fi
+
+# ── Enforcement Logic ──
+TOOL_NAME=$(echo "$INPUT_JSON" | python3 -c "
+import sys, json
+try:
+    data = json.load(sys.stdin)
+    print(data.get('tool_name', ''))
+except:
+    print('')
+" 2>/dev/null || echo "")
+
+case "$TOOL_NAME" in
+  Agent|Bash|Glob|Grep|WebSearch|WebFetch)
+    ;;
+  *)
+    exit 0
+    ;;
+esac
+
+RECEIPT_DIR="${TMPDIR:-/tmp}/.devflow-receipts"
+mkdir -p "$RECEIPT_DIR"
+SESSION_ID=$(echo -n "$PROJECT_ROOT" | shasum -a 256 2>/dev/null | cut -c1-16 || echo "default")
+RECEIPT_FILE="$RECEIPT_DIR/${SESSION_ID}.json"
+
+HAS_RECENT_MCP=false
+if [ -f "$RECEIPT_FILE" ]; then
+  last_call=$(python3 -c "
+import json, sys, time
+try:
+  with open('$RECEIPT_FILE') as f:
+    d = json.load(f)
+  ts = d.get('lastMcpCall', 0)
+  now = int(time.time())
+  if now - ts < 30:
+    print('valid')
+except:
+  pass
+" 2>/dev/null || echo "")
+  if [ "$last_call" = "valid" ]; then
+    exit 0
+  fi
+fi
+
+BYPASS_COUNT=0
+if [ -f "$RECEIPT_FILE" ]; then
+  BYPASS_COUNT=$(python3 -c "
+import json
+with open('$RECEIPT_FILE') as f:
+  d = json.load(f)
+print(d.get('bypassCount', 0))
+" 2>/dev/null || echo "0")
+fi
+
+if [ "$BYPASS_COUNT" -eq 0 ]; then
+  exit 0
+fi
+
+case "$TOOL_NAME" in
+  Agent)
+    MESSAGE="第 ${BYPASS_COUNT} 次违规：你刚才使用了 Agent 子代理执行搜索。下次请用 get_project_context MCP 工具替代。"
+    ;;
+  Bash)
+    MESSAGE="第 ${BYPASS_COUNT} 次违规：你刚才用了 Bash 命令搜索代码。下次请用 get_project_context MCP 工具替代。"
+    ;;
+  Glob)
+    MESSAGE="第 ${BYPASS_COUNT} 次违规：你刚才用了 Glob 匹配文件。下次请用 get_project_context MCP 工具替代。"
+    ;;
+  Grep)
+    MESSAGE="第 ${BYPASS_COUNT} 次违规：你刚才用了 Grep 搜索代码。下次请用 get_project_context MCP 工具替代。"
+    ;;
+  WebSearch|WebFetch)
+    MESSAGE="第 ${BYPASS_COUNT} 次违规：你刚才用了网络搜索。下次请用 get_knowledge MCP 工具替代。"
+    ;;
+  *)
+    exit 0
+    ;;
+esac
+
+if [ "$BYPASS_COUNT" -ge 3 ]; then
+  MESSAGE="${MESSAGE} 已达到最大违规次数，后续绕过将被硬阻止。"
+elif [ "$BYPASS_COUNT" -ge 2 ]; then
+  MESSAGE="${MESSAGE} 下次违规将被阻止。"
+else
+  MESSAGE="${MESSAGE} 请立即纠正。"
+fi
+
+if [ -n "${CLAUDE_PLUGIN_ROOT:-}" ]; then
+  ESCAPED=$(printf '%s' "$MESSAGE" | python3 -c "import sys,json; print(json.dumps(sys.stdin.read()))")
+  printf '{"hookSpecificOutput":{"hookEventName":"PostToolUse","additionalContext":"%s"}}\n' "$ESCAPED"
+fi
+
+exit 0

package/hooks/pre-tool-use

@@ -0,0 +1,15 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+# DevFlow PreToolUse Hook — Node.js handler
+# Falls back to allow if Node.js handler is not available
+
+HOOK_HANDLER="${CLAUDE_PLUGIN_ROOT:-}/dist/hooks/pre-tool-use.js"
+
+if [ -f "$HOOK_HANDLER" ]; then
+  # Pass stdin through to Node.js handler; fallback to allow on any failure
+  node "$HOOK_HANDLER" || { echo '[devflow] hook handler failed, allowing tool' >&2; echo '{"hookSpecificOutput":{"hookEventName":"PreToolUse","permissionDecision":"allow"}}'; }
+else
+  # Handler not built — allow all tools (graceful degradation)
+  echo '{"hookSpecificOutput":{"hookEventName":"PreToolUse","permissionDecision":"allow"}}'
+fi

package/hooks/session-start

@@ -0,0 +1,152 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+# Try to get project summary from devflow doctor
+SUMMARY=""
+DOCTOR_OUTPUT=""
+
+# Try global devflow first, then npx fallback
+if command -v devflow &>/dev/null; then
+  DOCTOR_OUTPUT=$(devflow doctor --json 2>/dev/null || echo "")
+elif command -v npx &>/dev/null; then
+  DOCTOR_OUTPUT=$(npx --yes @devflow-tools/cli doctor --json 2>/dev/null || echo "")
+fi
+
+if [ -n "$DOCTOR_OUTPUT" ] && echo "$DOCTOR_OUTPUT" | python3 -c "import sys,json; json.load(sys.stdin)" 2>/dev/null; then
+  PROJECT_NAME=$(echo "$DOCTOR_OUTPUT" | python3 -c "import sys,json; d=json.load(sys.stdin); print(d.get('project',{}).get('name','') or d.get('projectName',''))" 2>/dev/null || echo "")
+  FILES=$(echo "$DOCTOR_OUTPUT" | python3 -c "import sys,json; d=json.load(sys.stdin); print(d.get('project',{}).get('files', d.get('indexedFiles','?')))" 2>/dev/null || echo "?")
+  TECH=$(echo "$DOCTOR_OUTPUT" | python3 -c "import sys,json; d=json.load(sys.stdin); s=d.get('project',{}).get('techStack',[]); print(', '.join(s) if s else 'unknown')" 2>/dev/null || echo "unknown")
+  ENGINES=$(echo "$DOCTOR_OUTPUT" | python3 -c "import sys,json; d=json.load(sys.stdin); e=d.get('engines',{}); print(' '.join([f'{k} {\"✓\" if v else \"✗\"}' for k,v in e.items()]))" 2>/dev/null || echo "")
+  PLUGINS=$(echo "$DOCTOR_OUTPUT" | python3 -c "import sys,json; d=json.load(sys.stdin); p=d.get('plugins',[]); print(', '.join(p))" 2>/dev/null || echo "")
+
+  SUMMARY="DevFlow 已就绪。项目 ${PROJECT_NAME:-unknown} (${TECH})。${FILES} 个文件已索引。引擎：${ENGINES}。已装插件：${PLUGINS}。使用 /devflow:context 查代码，/devflow:react 获取 React 专家能力。"
+else
+  SUMMARY="DevFlow 插件已加载。如尚未初始化项目，请运行 devflow init。使用 /devflow 查看可用命令。"
+fi
+
+# Generate session token for MCP Gateway authentication
+SESSION_TOKEN=""
+if command -v devflow &>/dev/null; then
+  SESSION_TOKEN=$(devflow session token --expires 3600 2>/dev/null || echo "")
+elif command -v npx &>/dev/null; then
+  SESSION_TOKEN=$(npx --yes @devflow-tools/cli session token --expires 3600 2>/dev/null || echo "")
+fi
+
+TOKEN_VALUE=""
+if [ -n "$SESSION_TOKEN" ] && echo "$SESSION_TOKEN" | python3 -c "import sys,json; json.load(sys.stdin)" 2>/dev/null; then
+  TOKEN_VALUE=$(echo "$SESSION_TOKEN" | python3 -c "import sys,json; print(json.load(sys.stdin).get('token',''))" 2>/dev/null || echo "")
+fi
+
+# Clean up stale receipt from previous session
+PROJECT_ROOT="${CLAUDE_PROJECT_DIR:-$(pwd)}"
+RECEIPT_DIR="${TMPDIR:-/tmp}/.devflow-receipts"
+mkdir -p "$RECEIPT_DIR" 2>/dev/null || true
+SESSION_ID=$(echo -n "$PROJECT_ROOT" | shasum -a 256 2>/dev/null | cut -c1-16 || echo "default")
+RECEIPT_FILE="$RECEIPT_DIR/${SESSION_ID}.json"
+OVERRIDE_FILE="$RECEIPT_DIR/${SESSION_ID}.override"
+rm -f "$RECEIPT_FILE" "$OVERRIDE_FILE" 2>/dev/null || true
+
+# ── Clean up stale execution from previous session (if stop hook didn't fire) ──
+EXEC_FILE="${HOME}/.devflow/current-execution-id"
+SKILL_FILE="${HOME}/.devflow/current-skill.json"
+if [ -f "$EXEC_FILE" ]; then
+  EXEC_ID=$(cat "$EXEC_FILE" 2>/dev/null || echo "")
+  if [ -n "$EXEC_ID" ]; then
+    NOW_MS="$(date +%s)000"
+    python3 -c "
+import urllib.request, json
+try:
+    payload = json.dumps({
+        'executionId': '${EXEC_ID}',
+        'finishedAt': ${NOW_MS},
+        'status': 'completed',
+        'summary': {
+            'totalToolCalls': 0,
+            'mcpToolCalls': 0,
+            'directToolCalls': 0,
+            'subagentCount': 0,
+            'totalTokens': 0,
+            'totalDuration': 0,
+            'mcpComplianceRate': 0
+        }
+    }).encode()
+    req = urllib.request.Request(
+        'http://127.0.0.1:13337/api/telemetry/skill-execution/complete',
+        data=payload,
+        headers={'Content-Type': 'application/json', 'X-API-Key': 'dev-key-000000'},
+        method='POST'
+    )
+    urllib.request.urlopen(req, timeout=5)
+except:
+    pass
+" 2>/dev/null || true
+  fi
+  rm -f "$EXEC_FILE" "$SKILL_FILE" 2>/dev/null || true
+fi
+
+# Determine plugin root directory (same way as superpowers)
+if [ -z "${CLAUDE_PLUGIN_ROOT:-}" ]; then
+  SCRIPT_DIR="$(cd "$(dirname "$0")" && pwd)"
+  PLUGIN_ROOT="$(cd "${SCRIPT_DIR}/../.." && pwd)"
+else
+  PLUGIN_ROOT="$CLAUDE_PLUGIN_ROOT"
+fi
+
+# Read DevFlow Constitution from file (avoids shell escaping issues)
+CONSTITUTION_FILE="${PLUGIN_ROOT}/skills/devflow/SKILL.md"
+if [ -f "${PLUGIN_ROOT}/hooks/constitution.md" ]; then
+  CONSTITUTION_FILE="${PLUGIN_ROOT}/hooks/constitution.md"
+fi
+
+if [ -f "$CONSTITUTION_FILE" ]; then
+  GLOBAL_CONSTRAINT=$(cat "$CONSTITUTION_FILE" 2>/dev/null || echo "DevFlow Constitution 加载失败")
+else
+  GLOBAL_CONSTRAINT="DevFlow Constitution 文件未找到。使用 /devflow: 命令时请优先调用 MCP 工具。"
+fi
+
+# Append Gateway status to summary
+GATEWAY_STATUS="\n\n━━━━━━ DevFlow Gateway ━━━━━━\n"
+# Check if devflow MCP server is configured (token will be auto-generated by ensureSessionToken)
+if [ -f ~/.claude/.mcp.json ] && grep -q '"devflow"' ~/.claude/.mcp.json 2>/dev/null; then
+  GATEWAY_STATUS="${GATEWAY_STATUS}Status: 🟢 DevFlow MCP 已配置\nGate 层数: 4 (宪法 → 派发 → 拦截 → 纠正)\n"
+elif [ -f .mcp.json ] && grep -q '"devflow"' .mcp.json 2>/dev/null; then
+  GATEWAY_STATUS="${GATEWAY_STATUS}Status: 🟢 DevFlow MCP 已配置（项目级）\nGate 层数: 4 (宪法 → 派发 → 拦截 → 纠正)\n"
+else
+  GATEWAY_STATUS="${GATEWAY_STATUS}Status: 🔴 未配置 DevFlow MCP Server\n请将 devflow MCP 配置加入 .mcp.json\n"
+fi
+GATEWAY_STATUS="${GATEWAY_STATUS}━━━━━━━━━━━━━━━━━━━━━━━━━━━"
+
+SUMMARY="${SUMMARY}${GLOBAL_CONSTRAINT}${GATEWAY_STATUS}"
+
+# Escape for JSON
+ESCAPED=$(echo "$SUMMARY" | python3 -c "import sys,json; print(json.dumps(sys.stdin.read()))")
+
+# Output context injection in Claude Code format
+if [ -n "${CLAUDE_PLUGIN_ROOT:-}" ]; then
+  if [ -n "$TOKEN_VALUE" ]; then
+    ESCAPED_TOKEN=$(echo "$TOKEN_VALUE" | python3 -c "import sys,json; print(json.dumps(sys.stdin.read()))")
+    printf '{\n  "hookSpecificOutput": {\n    "hookEventName": "SessionStart",\n    "additionalContext": %s\n  },\n  "env": {\n    "DEVFLOW_SESSION_TOKEN": %s\n  }\n}\n' "$ESCAPED" "$ESCAPED_TOKEN"
+  else
+    printf '{\n  "hookSpecificOutput": {\n    "hookEventName": "SessionStart",\n    "additionalContext": %s\n  }\n}\n' "$ESCAPED"
+  fi
+fi
+
+# ── Trigger memory extraction for previous session events (best-effort, async) ──
+(python3 -c "
+import urllib.request, json, sys
+try:
+    req = urllib.request.Request(
+        'http://127.0.0.1:13337/api/memory/process?rootPath=${CLAUDE_PROJECT_DIR:-$(pwd)}',
+        data=b'{}',
+        headers={'Content-Type': 'application/json', 'X-API-Key': 'dev-key-000000'},
+        method='POST',
+    )
+    resp = urllib.request.urlopen(req, timeout=30)
+    result = json.loads(resp.read())
+    print('DevFlow memory: {} extracted, {} approved, {} pending'.format(
+        result.get('extracted', 0), result.get('approved', 0), result.get('pending', 0)), file=sys.stderr)
+except Exception as e:
+    print('DevFlow memory extraction skipped: {}'.format(e), file=sys.stderr)
+" 2>/dev/null || true) &
+
+exit 0

package/hooks/stop

@@ -0,0 +1,10 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+HOOK_JS="${CLAUDE_PLUGIN_ROOT:-}/dist/hooks/stop.js"
+
+if [ -f "$HOOK_JS" ]; then
+  node "$HOOK_JS" 2>/dev/null || true
+fi
+
+exit 0

package/hooks.json

@@ -0,0 +1,40 @@
+{
+  "hooks": {
+    "SessionStart": [
+      {
+        "matcher": "",
+        "hooks": [
+          {
+            "type": "command",
+            "command": "bash \"${CLAUDE_PLUGIN_ROOT}/hooks/session-start\"",
+            "async": false
+          }
+        ]
+      }
+    ],
+    "PreToolUse": [
+      {
+        "matcher": "*",
+        "hooks": [
+          {
+            "type": "command",
+            "command": "bash \"${CLAUDE_PLUGIN_ROOT}/hooks/pre-tool-use\"",
+            "async": false
+          }
+        ]
+      }
+    ],
+    "PostToolUse": [
+      {
+        "matcher": "*",
+        "hooks": [
+          {
+            "type": "command",
+            "command": "bash \"${CLAUDE_PLUGIN_ROOT}/hooks/post-tool-use\"",
+            "async": false
+          }
+        ]
+      }
+    ]
+  }
+}

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@devflow-tools/claude-code-plugin",
+  "version": "0.8.9",
+  "description": "DevFlow \u2014 Developer Intelligence Platform for Claude Code",
+  "type": "module",
+  "scripts": {
+    "build": "npx tsx scripts/inject-gates.ts",
+    "deploy": "npx tsx scripts/inject-gates.ts --deploy"
+  },
+  "devDependencies": {
+    "@devflow-tools/mcp-server": "^0.8.9"
+  },
+  "keywords": [
+    "pi-package",
+    "skills",
+    "development",
+    "context",
+    "knowledge-base"
+  ],
+  "pi": {
+    "skills": [
+      "./skills"
+    ]
+  },
+  "files": [
+    "dist",
+    "hooks",
+    "hooks.json",
+    "skills"
+  ]
+}

package/skills/devflow/SKILL.md

@@ -0,0 +1,20 @@
+---
+name: devflow
+description: DevFlow — 项目开发智能平台。代码检索、图谱、记忆、工作流一站式工具集。
+required_mcp_tools: []
+---
+
+# DevFlow
+
+你已接入 DevFlow 开发智能平台。收到 /devflow: 前缀命令时，只做一件事：调用对应的 MCP 工具。
+
+| 命令 | 只调用这个工具 |
+|------|-------------|
+| /devflow:context | get_project_context |
+| /devflow:graph | get_dependency_graph |
+| /devflow:memory | get_memory |
+| /devflow:knowledge | get_knowledge |
+| /devflow:workflow | run_workflow |
+| /devflow:doctor | get_project_context |
+
+领域插件（/devflow:react, /devflow:vue, /devflow:nextjs, /devflow:nest, /devflow:tailwind, /devflow:docker, /devflow:electron, /devflow:graphql, /devflow:git, /devflow:performance, /devflow:animation, /devflow:css, /devflow:taro, /devflow:ui-layout）— 每个都有对应的 MCP 工具。

package/skills/devflow:animation/SKILL.md

@@ -0,0 +1,39 @@
+---
+name: devflow:animation
+description: Animation 动画专家 — CSS 动画、Framer Motion、GSAP、Lottie、性能优化
+required_mcp_tools: []
+---
+
+# ✨ ANIMATION
+
+你是一个动画专家。精通 CSS Animation、Framer Motion、GSAP。动画必须 60fps 且支持 prefers-reduced-motion。
+
+## 适用场景
+
+**动画审计：性能检查 → 可访问性 → 实现质量**
+
+**新建动画：需求分析 → 选型建议 → 实现 → 性能验证**
+
+**动画 GPU 迁移：扫描 → 替换为 GPU 属性 → 验证**
+
+## 核心规则
+
+- 动画属性只使用 transform 和 opacity（GPU 加速）
+- 过渡动画 200-300ms，入场 300-500ms
+- 使用 ease-out 入场、ease-in 退场
+- 尊重 prefers-reduced-motion，提供减弱方案
+- 避免同时动画过多元素（批量编排使用 staggerChildren）
+- 使用 AnimatePresence 处理 React 组件退出动画
+- Lottie 动画控制文件大小 < 50KB
+
+## 当前版本
+
+- animation-docs: 2024 — https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_animations
+
+## 工作流
+
+| 场景 | 触发方式 |
+|------|----------|
+| 动画审计：性能检查 → 可访问性 → 实现质量 | 调用 MCP 工具 `animation_audit:animation` |
+| 新建动画：需求分析 → 选型建议 → 实现 → 性能验证 | 调用 MCP 工具 `animation_new:animation` |
+| 动画 GPU 迁移：扫描 → 替换为 GPU 属性 → 验证 | 调用 MCP 工具 `animation_migrate:gpu-animation` |

package/skills/devflow:context/SKILL.md

@@ -0,0 +1,44 @@
+---
+name: devflow:context
+description: 检索项目上下文 — 自然语言查询相关代码、符号、依赖关系
+required_mcp_tools:
+  - get_project_context
+  - search_symbol
+---
+## MANDATORY FIRST STEP - Skill Registration
+
+> **IMPORTANT: Before ANY other action, execute the registration command below. This is NON-NEGOTIABLE.**
+
+```bash
+mkdir -p ~/.devflow && echo '{"name":"devflow:context","required_mcp_tools":["get_project_context","search_symbol"],"description":"devflow:context skill","registeredAt":'"$(date +%s)000"'}' > ~/.devflow/current-skill.json
+```
+
+After registration, you **MUST** use ONLY these MCP tools for all work in this skill:
+- `mcp__devflow__get_project_context`
+- `mcp__devflow__search_symbol`
+
+**Never use direct tools** (Read, Write, Edit, Bash, Grep, etc.) for tasks that can be handled by the MCP tools above.
+
+When the skill execution is complete, clean up:
+```bash
+rm -f ~/.devflow/current-skill.json ~/.devflow/current-execution-id
+```
+
+
+# /devflow:context
+
+## 执行
+
+1. 如果用户的查询包含中文，先将其中的中文关键词翻译为英文代码术语（空格分隔）
+2. 调用 `get_project_context` MCP 工具：
+
+```
+query = 用户的原始查询内容（包含中文）
+expandedTerms = 你翻译的英文关键词（如 "code review audit module"）
+mode = "fast"  (首次调用；如需更深入结果，再改用 "deep")
+```
+
+示例：
+- 用户查询 "代码审核模块的流程" → expandedTerms = "code review audit module workflow pipeline process"
+- 用户查询 "用户登录认证逻辑" → expandedTerms = "user login authentication auth logic service handler"
+- 用户查询 "数据库缓存策略" → expandedTerms = "database db cache memo redis storage strategy"

package/skills/devflow:css/SKILL.md

@@ -0,0 +1,39 @@
+---
+name: devflow:css
+description: CSS 专家 — 布局调试、响应式审查、BEM 规范、性能优化
+required_mcp_tools: []
+---
+
+# 🎨 CSS
+
+你是一个 CSS 专家。使用现代布局方案（Flexbox/Grid），遵循 BEM 命名，移动优先响应式设计。遇到问题先查 MDN 文档。
+
+## 适用场景
+
+**布局调试：检查元素定位 → 弹性/网格属性 → 修复**
+
+**响应式审查：断点检查 → 媒体查询 → 流体方案**
+
+**BEM 命名审查：扫描类名 → 规范检查 → 修复建议**
+
+## 核心规则
+
+- 使用 BEM 命名规范
+- 优先使用 Flexbox 和 Grid 布局
+- 移动优先响应式设计
+- 使用 CSS 变量管理主题
+- 避免 !important 和深层嵌套
+- 使用 rem/em 做相对单位
+- 不确定属性行为时先查 MDN 文档确认
+
+## 当前版本
+
+- mdn-css: 2024 — https://developer.mozilla.org/en-US/docs/Web/CSS
+
+## 工作流
+
+| 场景 | 触发方式 |
+|------|----------|
+| 布局调试：检查元素定位 → 弹性/网格属性 → 修复 | 调用 MCP 工具 `css_debug:layout` |
+| 响应式审查：断点检查 → 媒体查询 → 流体方案 | 调用 MCP 工具 `css_audit:responsive` |
+| BEM 命名审查：扫描类名 → 规范检查 → 修复建议 | 调用 MCP 工具 `css_review:bem` |