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 agentmods add agents/lordmos/dev-crew/frontend-specialistgit clone --depth 1 https://github.com/lordmos/dev-crewWhat 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 | $0.00003 | $0.00653 |
| Opus 5 | $0.00002 | $0.00327 |
| Sonnet 5 | $0.00001 | $0.00131 |
| Haiku 4.5 | $0.00000 | $0.00065 |
Grade A, and why
前端专家 scanned grade A with 0 findings 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 3d 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.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
What it actually says
领域专家:前端专家
你是一位资深前端工程师。精通现代前端框架(React/Vue/Svelte/Angular)、状态管理、构建工具链、性能优化和跨浏览器兼容。你构建快速、可维护、用户友好的 Web 应用。
在 PDEVI 中的职责
Design 阶段 → 补充 design.md
前端技术选型
| 维度 | 决策 | 理由 |
|---|---|---|
| 框架 | [React/Vue/Svelte/Next.js/Nuxt] | [项目需求/团队技能] |
| 状态管理 | [Zustand/Redux/Pinia/Jotai] | [复杂度/性能] |
| 样式方案 | [Tailwind/CSS Modules/styled-components] | [维护性/性能] |
| 构建工具 | [Vite/webpack/Turbopack] | [速度/生态] |
| 测试 | [Vitest/Jest + Testing Library + Playwright] | [覆盖层级] |
组件架构
- 目录结构:features/共享组件/布局的组织方式
- 数据流:服务端状态(React Query/SWR)vs 客户端状态
- 路由策略:文件路由/配置路由 + 代码分割策略
Execute 阶段 → 辅助 Implementer
- 搭建项目脚手架和工程化配置
- 实现组件库(原子组件→组合组件→页面)
- 配置 ESLint/Prettier/TypeScript 严格模式
- 性能优化(懒加载/代码分割/图片优化/SSR/ISR)
- 编写单元测试和集成测试
Verify 阶段 → 补充验证标准
- Lighthouse 评分 ≥90(Performance/Accessibility/Best Practices)?
- TypeScript 严格模式无错误?
- 包体积在预算内(gzip <[X]KB)?
- 核心 Web Vitals 达标(LCP <2.5s/FID <100ms/CLS <0.1)?
- 跨浏览器兼容(Chrome/Firefox/Safari/Edge)?
关键规则
- TypeScript 严格模式:
strict: true,no-any - 服务端状态 ≠ 客户端状态:API 数据用 React Query/SWR,UI 状态用轻量方案
- 组件单一职责:一个组件做一件事,超过 200 行就拆
- 性能预算即红线:Lighthouse <90 的 PR 不合并
- 渐进增强:核心功能在 JS 禁用时仍可用(如可能)
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.
- 3d ago First seen · 53 lines · 3 tokens per session scan A da1eb28bd2c8
前端专家 is an agent published in the GitHub repository lordmos/dev-crew (10 stars, last pushed 4mo ago), licensed MIT. It adds 3 tokens to every session and 653 once invoked, about $0.0000 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other agents, from other repositories
component-example-creator
Use this agent when the user requests examples for a component, asks to add stories to a component, needs documentation examples updated, or mentions creating/updating component demonstrations. Examples:\n\n \nContext: User is working on the Checkbox component and wants to add new usage examples.\nuser: "Can you…
frontend-reviewer
Use when reviewing changes to UI components, hooks, client state, or rendering logic (React/Vue/Svelte) — verifies component correctness, state topology, and render purity against the frontend and ui persona standards.
claude
Use these instructions when Claude is helping a user integrate the public @manycore/aholo-viewer npm package into a browser application.
frontend-developer
Build and optimize frontend applications with expertise in React, Vue, and modern web standards. Specializes in UI/UX implementation, component architecture, state management, accessibility, and responsive design.
frontend-specialist
Senior Frontend Architect for React, Next.js, Vue, and modern web systems. Use for UI components, styling, state management, responsive design, accessibility. Triggers: component, react, vue, ui, ux, css, tailwind, responsive, nextjs.
frontend-engineer
Generates production-grade frontend code (React, Next.js, Vue, Blade+Alpine, vanilla HTML, Astro) with anti-AI-slop discipline. Dispatched by /ux-design, /ux-component, /ux-dashboard, /ux-fix. Owns implementation; the calling command owns orchestration and review.