create-vibe-workflow 0.1.0 → 0.2.0

package/dist/templates/skills/devops/deployment-patterns/SKILL.md.ejs

@@ -0,0 +1,228 @@
+# Deployment Patterns — 部署模式
+
+> 使用此 skill 时：设计部署流水线、选择部署策略、配置健康检查、管理回滚。
+
+## CI/CD 流水线
+
+### 标准流水线结构
+
+```text
+┌─ Code Push ─→ CI（构建+测试） ─→ CD（部署） ─→ 验证 ─→ 完成
+
+【CI 阶段（提交触发）】
+  1. Lint + 类型检查
+  2. 单元测试 + 集成测试
+  3. 构建（编译、打包）
+  4. 构建镜像（Docker build）
+  5. 镜像扫描（安全漏洞）
+  6. 推送镜像到仓库
+
+【CD 阶段（手动/自动触发）】
+  1. 从镜像仓库拉取指定版本
+  2. 部署到目标环境
+  3. 运行健康检查
+  4. 运行 Smoke Test
+  5. 切换流量（如有负载均衡）
+  6. 通知团队
+```
+
+### 环境管理
+
+```text
+开发（Development）：
+  - 开发者自行部署
+  - 自动从 feature 分支部署
+  - 不稳定，用于快速迭代
+
+测试（Staging / QA）：
+  - 合并到 main 后自动部署
+  - 运行全量测试套件
+  - 模拟生产环境配置
+
+生产（Production）：
+  - 从 Staging 提升（promotion）
+  - 需要审批流程
+  - 蓝绿/灰度发布
+
+环境差异性管理：
+  build once, deploy many
+  同一构建产物部署到所有环境
+  通过环境变量区分配置
+```
+
+## 部署策略
+
+### 策略对比
+
+| 策略 | 零停机 | 回滚速度 | 成本 | 适用场景 |
+|------|--------|---------|------|---------|
+| Rolling | 是 | 慢 | 低 | 标准 Web 服务 |
+| Blue-Green | 是 | 极快 | 高（双倍资源） | 关键服务 |
+| Canary | 是 | 中 | 中 | 高风险变更 |
+| Recreate | 否 | N/A | 低 | 内部工具/定时任务 |
+
+### Rolling Update（滚动更新）
+
+```text
+过程：
+  1. 启动新版本实例（逐台替换）
+  2. 旧实例下线前完成请求处理
+  3. 新实例通过健康检查后开始接收流量
+
+配置要点：
+  maxSurge: 1           # 最多超出目标实例数 1 个
+  maxUnavailable: 0     # 始终保持 100% 可用
+  minReadySeconds: 30   # 新实例就绪后等待 30 秒再继续
+
+适用场景：
+  - 无状态服务
+  - 多实例（≥3）
+  - 可以接受慢回滚
+```
+
+### Blue-Green Deployment（蓝绿部署）
+
+```text
+过程：
+  1. Blue（当前生产环境）
+  2. Green（新版本环境，独立部署）
+  3. Green 验证通过后，切换负载均衡指向 Green
+  4. Blue 保留以备回滚
+
+回滚：
+  - 负载均衡切回 Blue（秒级回滚）
+  - Blue 实例保持运行直到确认稳定
+
+资源要求：
+  - 双倍基础设施
+  - 数据库需前后兼容（两个版本同时读写）
+
+适用场景：
+  - 关键业务服务
+  - 需要即时回滚
+  - 可以承担双倍资源成本
+```
+
+### Canary Release（金丝雀发布）
+
+```text
+过程：
+  1. 部署新版本到少量实例（如 5% 流量）
+  2. 监控错误率、延迟、业务指标
+  3. 稳定后逐步增加流量（10% → 25% → 50% → 100%）
+  4. 异常时自动回滚
+
+流量路由方式：
+  - 负载均衡权重
+  - 基于用户群体（内部用户先使用）
+  - 基于地域
+
+适用场景：
+  - 高风险大版本更新
+  - 需要真实流量验证
+  - 有完善的监控体系
+```
+
+## 健康检查端点
+
+### 三级检查体系
+
+```text
+【就绪检查（Readiness）】
+  端点：GET /health/ready
+  目的：服务是否准备好接收流量
+  检查：依赖服务可用（DB、缓存、队列连接正常）
+  失败：从负载均衡移除，不停止容器
+
+【存活检查（Liveness）】
+  端点：GET /health/live
+  目的：服务是否正常运行
+  检查：进程响应、无死锁
+  失败：重启容器
+
+【启动检查（Startup）】
+  端点：GET /health/startup
+  目的：服务是否完成初始化
+  检查：预热完成、数据加载完成
+  失败：延长等待，不杀死进程
+
+实现建议：
+  /health 端点应：
+    - 返回 200 表示健康
+    - 返回 5xx 表示不健康
+    - 不包含敏感信息
+    - 快速响应（< 100ms）
+    - 不进行复杂计算
+```
+
+## 回滚策略
+
+```text
+【触发回滚的条件】
+  - 健康检查连续失败
+  - 错误率超过阈值（如 5xx > 1%）
+  - 延迟超过基准线 2 倍
+  - 业务指标异常（如转化率下降）
+  - 手动触发（线上事故）
+
+【回滚方式】
+  快速回滚（秒级）：
+    - 负载均衡切回旧版本（蓝绿部署）
+    - DNS 切换
+
+  标准回滚（分级）：
+    - 恢复到上一个稳定版本
+    - 数据库迁移需回滚
+
+  重建回滚（分钟级）：
+    - 从头部署旧版本
+    - 适用：非容器化部署
+
+【回滚后操作】
+  1. 确认服务恢复
+  2. 通知团队
+  3. 分析事故原因
+  4. 更新测试防止重现
+```
+
+## 环境变量与配置管理
+
+```text
+【配置分层】
+  代码级           → 不随环境变化（默认值、常量）
+  构建级           → 构建时注入（构建时间、Git commit）
+  部署级（环境变量） → 环境差异（DB URL、API Key）
+  运行时级          → 运行时获取（配置中心、Secrets Manager）
+
+【敏感配置】
+  不使用环境变量（日志可能泄露）
+  使用密钥管理服务（Vault、AWS Secrets Manager、GCP Secret Manager）
+  或加密后提交，部署时解密
+
+【配置验证】
+  启动时验证所有必需配置存在
+  缺失时快速失败（fail fast）
+  打印缺失的配置名（但不打印值）
+```
+
+## 监控与告警
+
+```text
+【必须监控的指标】
+  可用性  — 健康检查成功率
+  性能    — 请求延迟（P50/P95/P99）
+  容量    — CPU/内存/磁盘/网络
+  错误    — 错误率（4xx/5xx）
+  业务    — 关键业务指标（注册数、订单数）
+
+【告警规则】
+  P0（紧急）：服务不可用、数据丢失 → 即时通知
+  P1（高）：延迟飙升、错误率突增 → 5 分钟内通知
+  P2（中）：容量接近上限 → 24 小时内处理
+  P3（低）：非关键警告 → 下一迭代处理
+
+【告警原则】
+  - 告警可行动（收到告警能采取具体操作）
+  - 避免告警疲劳（太少 ≠ 太多）
+  - 告警包含上下文（什么服务、什么指标、多久了）
+```

package/dist/templates/skills/devops/docker-patterns/SKILL.md.ejs

@@ -0,0 +1,215 @@
+# Docker Patterns — Docker 容器化模式
+
+> 使用此 skill 时：编写 Dockerfile、配置 Compose、优化镜像、排查容器问题。
+
+## 开发环境配置
+
+### Docker Compose 结构
+
+```text
+compose.yaml
+├── services:
+│   ├── app          # 应用服务
+│   ├── db           # 数据库
+│   ├── cache        # 缓存（Redis / Memcached）
+│   ├── queue        # 消息队列
+│   └── proxy        # 反向代理（开发用）
+├── volumes:         # 持久化数据
+└── networks:        # 网络隔离
+```
+
+### 开发环境要点
+
+```text
+【热重载】
+  - 挂载源码目录到容器内（volumes）
+  - 应用进程支持文件变化自动重启
+
+【环境变量】
+  - 用 .env 文件管理（不提交到 git）
+  - compose.yaml 引用 ${VARIABLE:-default}
+
+【端口映射】
+  - 只暴露需要的端口
+  - 避免端口冲突（映射到随机主机端口）
+
+示例卷挂载：
+  volumes:
+    - ./src:/app/src           # 源码热重载
+    - /app/node_modules        # 匿名卷（覆盖，防止覆盖容器内依赖）
+```
+
+## 多阶段构建
+
+### 通用模式
+
+```text
+【第一阶段：构建（Builder）】
+  FROM base AS builder
+  WORKDIR /app
+  COPY package.json ./
+  RUN install dependencies
+  COPY . .
+  RUN build
+
+【第二阶段：运行（Runtime）】
+  FROM runtime-base
+  WORKDIR /app
+  COPY --from=builder /app/dist ./dist
+  COPY --from=builder /app/node_modules ./node_modules
+  EXPOSE 3000
+  CMD ["run"]
+```
+
+### 优化技巧
+
+```text
+缓存利用：
+  1. 先复制依赖配置文件（package.json / requirements.txt）
+  2. 安装依赖（这一层会缓存，源码不变时不重跑）
+  3. 再复制源码
+  4. 最后构建
+
+  # 好 — 利用缓存
+  COPY package.json .
+  RUN npm install
+  COPY src/ .
+  RUN npm run build
+
+  # 坏 — 每次重装依赖
+  COPY . .
+  RUN npm install && npm run build
+
+减少层数：
+  - 合并 RUN 命令（&& 连接）
+  - 清理缓存文件（apt-get clean、npm cache clean --force）
+  - 多阶段构建只复制产物
+
+基础镜像选择：
+  alpine       → 最小体积（但 musl libc 可能不兼容）
+  slim         → Debian 精简版（推荐）
+  distroless   → 最小攻击面（但调试困难）
+  结论：首选 slim，需要最小体积用 distroless
+```
+
+## 安全最佳实践
+
+```text
+【不使用 root 用户运行】
+  RUN groupadd -r appuser && useradd -r -g appuser appuser
+  USER appuser
+
+【最小基础镜像】
+  - 越小的镜像 = 越小的攻击面
+  - 避免包含编译器、调试工具、包管理器
+
+【镜像漏洞扫描】
+  定期扫描：trivy / docker scan / snyk
+  CI 中集成：漏洞阻断（CRITICAL/HIGH）
+
+【其他安全措施】
+  - 不将敏感信息写入镜像（构建参数 vs 环境变量）
+  - 使用 secrets 挂载（BuildKit: --secret）
+  - READ_ONLY 根文件系统（read_only: true）
+  - 限制容器能力（cap_drop: ALL）
+  - 不暴露 Docker socket（除非绝对必要）
+```
+
+## 日志管理
+
+```text
+【原则】
+  应用 → stdout/stderr → Docker 收集 → 日志驱动 → 集中管理
+
+12-Factor App：
+  应用将日志写入 stdout/stderr
+  Docker 负责收集和路由
+
+生产环境日志驱动（compose.yaml）：
+  logging:
+    driver: "json-file"
+    options:
+      max-size: "10m"
+      max-file: "3"
+
+集中日志方案：
+  - 文件日志驱动 + Filebeat → Elasticsearch
+  - syslog 驱动 → 集中日志服务器
+  - awslogs / gcp 驱动 → 云平台日志服务
+```
+
+## 常见服务模板
+
+### PostgreSQL
+
+```text
+db:
+  image: postgres:16-alpine
+  environment:
+    POSTGRES_DB: ${DB_NAME}
+    POSTGRES_USER: ${DB_USER}
+    POSTGRES_PASSWORD: ${DB_PASSWORD}
+  volumes:
+    - pgdata:/var/lib/postgresql/data
+    - ./init-db:/docker-entrypoint-initdb.d  # 初始化脚本
+  healthcheck:
+    test: ["CMD-SHELL", "pg_isready -U ${DB_USER}"]
+    interval: 5s
+    timeout: 5s
+    retries: 5
+```
+
+### Redis
+
+```text
+cache:
+  image: redis:7-alpine
+  command: redis-server --requirepass ${REDIS_PASSWORD}
+  volumes:
+    - redis-data:/data
+  healthcheck:
+    test: ["CMD", "redis-cli", "ping"]
+    interval: 5s
+    timeout: 3s
+    retries: 5
+```
+
+### Nginx（反向代理）
+
+```text
+proxy:
+  image: nginx:alpine
+  volumes:
+    - ./nginx.conf:/etc/nginx/nginx.conf:ro
+    - ./public:/var/www/public:ro
+  ports:
+    - "80:80"
+    - "443:443"
+  depends_on:
+    - app
+```
+
+## Docker 排查命令
+
+```text
+查看日志：
+  docker logs {container}                    # 标准日志
+  docker logs -f {container}                 # 实时追踪
+  docker logs --tail 100 {container}         # 只看最后 100 行
+
+检查进程：
+  docker exec {container} ps aux             # 运行了什么进程
+  docker top {container}                     # Docker 封装的 top
+
+进入容器调试：
+  docker exec -it {container} sh             # 进入容器（alpine）
+  docker exec -it {container} bash           # 进入容器（debian）
+
+资源监控：
+  docker stats {container}                   # CPU/内存/网络
+  docker inspect {container} | jq '.[0].State'  # 容器状态
+
+构建调试：
+  docker build --no-cache .                  # 无缓存构建
+  docker build --progress=plain .            # 详细构建输出
+```

package/dist/templates/skills/frontend/frontend-patterns/SKILL.md.ejs

@@ -0,0 +1,195 @@
+# Frontend Patterns — 前端开发模式
+
+> 使用此 skill 时：实现 UI 组件、管理状态、优化前端性能时。
+
+## 组件组合模式
+
+### 原则
+
+```text
+【组合优于继承】
+- 小组件组合成复杂 UI
+- 每个组件只有一个职责
+- 组件不应知道父组件的内部细节
+
+【容器 vs 展示】
+- 容器组件：管理状态和数据获取
+- 展示组件：纯渲染，通过属性接收数据和回调
+```
+
+### 组件结构模板
+
+```text
+Component/
+├── Component.{ext}          # 主组件
+├── Component.types.{ext}    # 类型定义
+├── Component.styles.{ext}   # 样式
+├── Component.test.{ext}     # 测试
+├── parts/                   # 子组件
+│   ├── PartA.{ext}
+│   └── PartB.{ext}
+└── index.{ext}              # 重导出
+```
+
+## 状态管理决策矩阵
+
+| 场景 | 方案 | 说明 |
+|------|------|------|
+| 局部 UI 状态（表单输入、折叠展开） | 组件内局部状态 | 最简单的方案，不需要外部管理 |
+| 子组件需要访问父组件状态 | 属性传递（Props Drilling） | 1-2 层时适用 |
+| 多个不相关组件需要共享状态 | 提升状态（Lifting State Up） | 移到最近的共同祖先 |
+| 深层嵌套组件需要共享状态 | 上下文（Context） | 避免多层属性传递 |
+| 上下文+复杂更新逻辑 | 上下文 + Reducer | 类似 Redux 但内置 |
+| 跨页面/全局状态 | 专用状态管理库 | 如 Zustand、Pinia、Redux Toolkit |
+| 服务端数据缓存 | 数据获取库 | 如 React Query、SWR、Apollo |
+
+### 受控 vs 非受控
+
+```text
+受控组件：
+  值由父组件通过属性控制 + 通过回调通知变更
+  适用场景：需要实时验证、条件禁用、联动逻辑
+
+非受控组件：
+  值由组件自身管理，父组件通过 ref 获取
+  适用场景：简单表单、非关键输入、第三方集成
+
+规则：优先受控，只在确实不需要控制时才非受控。
+```
+
+### 上下文 + Reducer 模式
+
+```text
+适用场景：多个子组件共享状态，且有复杂更新逻辑
+
+结构：
+  [Provider 组件]
+    - 创建上下文
+    - 包装 Reducer（状态 + 分发函数）
+    - 提供状态和方法给子组件
+
+  [子组件]
+    - 通过上下文读取状态
+    - 通过分发函数发送动作
+
+限制：
+  - 上下文值变化时所有消费者重新渲染
+  - 不适合高频更新场景
+  - 拆分上下文避免不必要的重渲染
+```
+
+## 自定义 Hooks / Composables 模式
+
+### Hook 设计规则
+
+```text
+1. 以 use- 前缀命名（约定）
+2. 一个 hook 只做一件事
+3. 返回对象而非数组（调用方不需要记住顺序）
+4. 副作用集中管理
+5. 暴露 loading/error/data 三元状态
+```
+
+### 常见 Hook 类型
+
+```text
+数据获取 Hook：
+  use{Resource}() → { data, isLoading, error, refetch }
+
+状态管理 Hook：
+  use{Feature}State() → { state, actions, reset }
+
+事件处理 Hook：
+  use{Event}(handler) → 自动绑定和清理
+
+交叉观察 Hook：
+  use{Observer}(ref, options) → { entry, isIntersecting }
+
+媒体查询 Hook：
+  useMediaQuery(query) → boolean
+
+定时器 Hook：
+  useInterval(callback, delay) → { start, stop, isRunning }
+```
+
+## 性能优化模式
+
+### 优化策略决策
+
+| 场景 | 策略 | 实现方式 |
+|------|------|---------|
+| 计算开销大的纯函数 | 记忆化 | 缓存计算结果，输入不变时复用 |
+| 列表渲渲染 | 虚拟化 | 只渲染可见区域的元素 |
+| 大组件渲染 | 懒加载 | 按需加载组件代码 |
+| 图片加载 | 懒加载 | Intersection Observer + placeholder |
+| 不必要的重渲染 | 属性比较 | 减少不必要的重新渲染 |
+| 首次加载过慢 | 代码分割 | 按路由/按功能分包 |
+
+### 通用性能检查清单
+
+```
+[ ] 列表项有唯一且稳定的 key
+[ ] 大数据列表使用虚拟化
+[ ] 大文件/组件按需懒加载
+[ ] 图片使用适当大小和懒加载
+[ ] 计算密集型操作用记忆化
+[ ] 不必要属性传递已合并或消除
+[ ] 事件监听在组件卸载时清理
+[ ] 动画使用 GPU 加速属性（transform/opacity）
+```
+
+## 表单处理模式
+
+```text
+【表单模式三选一】
+
+简单表单（3-5 个字段）：
+  组件内状态管理
+  → 手动验证 → 提交
+
+中等表单（5-15 字段，有联动）：
+  表单库
+  → Schema 验证 → 自动错误展示 → 提交
+
+复杂表单（15+ 字段，多步骤，动态字段）：
+  表单库 + 状态管理
+  → Schema 验证 → 分步保存 → 最终提交
+```
+
+## 错误边界模式
+
+```text
+策略：每层 UI 区域包裹错误边界
+
+布局层：
+  → 全局错误页面（整个应用崩溃时显示）
+
+功能模块层：
+  → 模块降级（该模块不可用但不影响其他模块）
+
+单个组件层：
+  → 组件回退（显示占位或重试按钮）
+
+错误边界应提供：
+  1. 用户友好提示
+  2. 重试按钮
+  3. 错误日志上报（开发者可追溯）
+```
+
+## 无障碍（Accessibility）
+
+```text
+最低标准（必须做到）：
+  [ ] 所有交互元素可通过键盘操作
+  [ ] 图片有 alt 文本
+  [ ] 表单输入有 label
+  [ ] 颜色对比度 ≥ 4.5:1
+  [ ] 动态内容更新有 aria-live 区域
+
+进阶标准（推荐做到）：
+  [ ] 页面有合理的 heading 层级
+  [ ] 焦点顺序符合视觉顺序
+  [ ] 自定义组件有正确的 ARIA role
+  [ ] 错误提示通过 aria-describedby 关联
+  [ ] 支持减少动效（prefers-reduced-motion）
+```

package/dist/templates/skills/skill-manifest.json

@@ -0,0 +1,59 @@
+{
+  "version": 1,
+  "domains": {
+    "workflow": {
+      "always": true,
+      "label": "工作流核心",
+      "desc": "开发流程强制执行",
+      "skills": [
+        "tdd-workflow",
+        "verification-loop",
+        "security-review",
+        "coding-standards",
+        "search-first",
+        "strategic-compact"
+      ]
+    },
+    "frontend": {
+      "projectTypes": ["web", "fullstack"],
+      "label": "前端开发",
+      "desc": "组件/状态/性能模式",
+      "skills": ["frontend-patterns"]
+    },
+    "backend": {
+      "projectTypes": ["api", "fullstack"],
+      "label": "后端开发",
+      "desc": "API/仓储/服务层模式",
+      "skills": ["backend-patterns"]
+    },
+    "database": {
+      "needsDb": true,
+      "label": "数据库",
+      "desc": "索引/迁移/查询优化",
+      "skills": ["postgres-patterns", "database-migrations"]
+    },
+    "testing": {
+      "projectTypes": ["web", "api", "fullstack"],
+      "label": "测试",
+      "desc": "E2E 自动化测试",
+      "skills": ["e2e-testing"]
+    },
+    "devops": {
+      "manual": true,
+      "label": "DevOps",
+      "desc": "Docker/CI/CD/部署",
+      "skills": ["docker-patterns", "deployment-patterns"]
+    },
+    "advanced": {
+      "userLevel": "developer",
+      "label": "进阶技能",
+      "desc": "诊断/架构审计/精简沟通",
+      "skills": [
+        "caveman",
+        "diagnose",
+        "improve-codebase-architecture",
+        "grill-with-docs"
+      ]
+    }
+  }
+}

package/dist/templates/skills/skills-lock.template.json

@@ -0,0 +1,12 @@
+{
+  "version": 1,
+  "skills": {},
+  "_comment": "在此记录手动安装的外部技能。格式参考 _example",
+  "_example": {
+    "agent-browser": {
+      "source": "vercel-labs/agent-browser",
+      "sourceType": "github",
+      "computedHash": ""
+    }
+  }
+}