Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add bovinphang/frontend-craft --skill fec-debug-frameworkgit clone --depth 1 https://github.com/bovinphang/frontend-craftWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/bovinphang/frontend-craft/fec-debug-framework)<a href="https://agentmods.dev/skills/bovinphang/frontend-craft/fec-debug-framework"><img src="https://agentmods.dev/badge/skills/bovinphang/frontend-craft/fec-debug-framework/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/bovinphang/frontend-craft/fec-debug-framework"><img src="https://agentmods.dev/badge/skills/bovinphang/frontend-craft/fec-debug-framework.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00066 | $0.01372 |
| Opus 5.5 | $0.00026 | $0.00549 |
| Sonnet 5.5 | $0.00013 | $0.00274 |
| Haiku 4.5 | $0.00007 | $0.00137 |
Grade A, and why
fec-debug-framework scanned grade A with 1 finding against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 1mo ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Makes network callslowCapability
Not a fault in itself. Listed so you know the mod talks to something, and to what.
- curl 独立复现(排除前端干扰) How it starts
The opening of the file, as written. The whole thing — 158 lines — stays where its author put it; the contents beside it link to each section on GitHub.
前端诊断框架
用途
用证据驱动的分类、收集、假设、验证和修复流程定位前端故障,避免凭直觉扩大改动范围。
流程
所有前端问题诊断遵循统一流程:
Step 1: 分类(Classify)
识别问题类型和影响范围:
| 类型 | 判断依据 | 诊断入口 |
|---|---|---|
| build | 命令退出非零、stderr 有错误 | → Build 模块 |
| runtime | 控制台异常、白屏、功能不可用 | → Runtime 模块 |
| ui | 视觉偏差、交互不符预期 | → UI 模块 |
| api | 请求状态码异常、数据不一致 | → API 模块 |
跨类型问题(如 API 失败导致 UI 异常)从最表层症状入手,逐层深入。
Step 2: 收集(Collect)
按类型收集证据(各模块有具体策略,见下方)。
Step 3: 假设(Hypothesize)
基于证据提出可能根因,按可能性排序:
- 每个假设必须可测试(有明确的验证方法)
- 最多保留 3 个假设,避免发散
- 格式:「因为 X,导致 Y,可通过 Z 验证」
Step 4: 验证(Verify)
逐一测试假设:
- 从最可能的假设开始
- 每次只改一个变量
- 验证结果记录:证实 / 证伪 / 待定
- 假设全部证伪时回到 Step 2 重新收集
Step 5: 修复与确认(Fix & Validate)
- 应用最小修复
- 运行受影响验证命令
- 确认无回归
- 输出修复报告
诊断模块
Build 模块
收集:运行最小失败命令,捕获完整 stderr/stdout 假设:按错误类型分组(类型错误、导入失败、配置解析、依赖缺失),匹配已知模式 验证:修一类根因 → 重跑命令 → 确认错误减少 特殊处理:
- 依赖版本、peer dependency、ESM/CJS、lockfile 相关失败先作为 build 兼容性问题收集证据
- 记录 package manager、Node 版本、lockfile diff、相关包版本和完整错误日志
- 不在缺少证据时升级依赖、手工编辑 lockfile,或把依赖迁移与普通调试修复混在同一批改动
- 若任务目标本身是版本升级、CVE 修复或 lockfile 风险评审,应转入依赖升级工作流
- CI 专属失败检查 Node 版本、包管理器、环境变量差异
Runtime 模块
收集:
- 复现路径(用户操作序列)
- 控制台错误和堆栈
- 组件渲染树状态(检查关键组件是否正确挂载)
- 相关 store/state 快照
假设:
- 堆栈反向追踪:从异常位置回溯到触发源
- 状态流分析:检查 state 变化是否符合预期
- 生命周期分析:是否在错误的时机访问了未初始化的数据
验证:
- 添加临时日志确认状态值
- 在可疑路径添加断言
- 复现路径验证修复
UI 模块
收集:
- 当前截图 vs 期望效果
- DOM 结构检查(元素是否存在、层级是否正确)
- 计算样式检查(实际应用的 CSS 值)
- 响应式断点测试
假设:
- CSS 特异性冲突(选择器权重不够被覆盖)
- 组件状态不匹配(props/state 未正确传递)
- 布局模型问题(flex/grid 配置错误)
- 响应式断点遗漏
验证:
- 浏览器 DevTools 实时调整验证
- 隔离组件测试(排除外部样式干扰)
- 多断点逐一验证
API 模块
收集:
- 请求 URL、method、headers、body
- 响应 status、headers、body
- 网络瀑布时序
- 相关 store/state 中的缓存数据
假设:
- 请求链路逐跳检查(URL → 中间件 → 拦截器 → 服务端)
- 数据转换检查(响应解析、类型映射)
- 缓存策略检查(过期、失效、竞态)
- 并发请求竞态(race condition)
验证:
- curl 独立复现(排除前端干扰)
- 逐层 mock 定位问题层级
- 端到端请求验证修复
详细参考
撰写诊断报告时,加载 references/report-template.md。
What ships with it
1 file beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 1mo ago First seen · 158 lines · 66 tokens per session scan A 06c6df90eca8
fec-debug-framework is a skill published in the GitHub repository bovinphang/frontend-craft (22 stars, last pushed 23d ago), licensed MIT. It adds 66 tokens to every session and 1,372 once invoked, about $0.0003 per session on Opus 5.5. A static security scan graded it A with 1 finding (makes network calls). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
audit
Project health audit and health check — architecture, performance, tests, dependencies, code quality. Use when assessing overall project health, before releases, or after refactors.
skeptical-triage
Reusable 3-round self-challenge + arbiter pattern for filtering false positives from findings/verdicts. Use when the cost of a false-positive gate block exceeds the cost of 4 extra LLM turns.
anti-patterns
Catalogue of known SDLC anti-patterns that greatcto agents must actively reject when reviewing architecture, plans, code, or post-mortems. Used by architect (pre-impl), pm (planning), senior-dev (impl), l3-support (post-incident).
review-all
Multi-agent code review for diffs (project-agnostic). Covers standards, bugs, security, DRY, smells, perf, tests, API contracts, a11y/i18n. Verifies each finding to eliminate false positives. Use for /review-all, pre-PR/pre-commit review, or auditing uncommitted/staged changes.
observability-baseline
Scaffold-time observability so a shipped product is not blind in prod from day one — error capture (Sentry), request-id structured logging, and /healthz + /readyz endpoints. stack-baseline pins Sentry but nothing wires it; this is the wiring. Loaded by app-scaffolder (bake into the scaffold), infra-provisioner (prod…
cypress-debugger
Use when a Cypress end-to-end test has already run and failed and the user wants the root cause and a concrete fix. Trigger on a failing Cypress spec, Timed-out-retrying command, unresolved selector, cy.intercept alias or request race, suite-breaking hook, retry-only flake, hydration or timing race, or a…