npx claudepluginhub xiaobei930/cc-best --plugin cc-bestThis skill is limited to using the following tools:
本技能提供前端开发的最佳实践和模式,支持多框架按需加载。
Builds frontend components, optimizes performance and bundle sizes, scaffolds projects, implements accessibility, reviews code quality, and designs UI/UX across React, Vue, Svelte, and other frameworks.
Guides frontend UI/UX development with patterns for responsive design, accessibility, component architecture, state management, visual consistency, performance, and testing. Useful for any frontend task.
Discovers and provides access to specialized skills for React/Next.js frontend development including components, state, data fetching, forms, accessibility, performance, SEO, and TUI interfaces.
Share bugs, ideas, or general feedback.
本技能提供前端开发的最佳实践和模式,支持多框架按需加载。
package.json 按需加载)根据项目 package.json 依赖加载对应文件:
| 技术栈 | 加载文件 | 框架 |
|---|---|---|
| Vue | vue.md | Vue 3, Nuxt 3 |
| React | react.md | React 18, Next.js |
| Svelte | svelte.md | Svelte, SvelteKit |
| Angular | angular.md | Angular 17+ |
| 文件 | 内容 |
|---|---|
| vue.md | Vue 3 + Composition API 模式 |
| react.md | React 18 + Hooks 模式 |
| svelte.md | Svelte/SvelteKit 模式 |
| angular.md | Angular 17+ 模式 |
| performance.md | Core Web Vitals 优化 |
| tailwind.md | Tailwind 最佳实践 + v4 迁移 |
| design-guide.md | 设计方法论与审查清单 |
| patterns.md | 通用组件/状态管理/表单/动画/a11y 模式 |
| 指标 | 目标 | 说明 |
|---|---|---|
| LCP | < 2.5s | 最大内容绘制 |
| FID | < 100ms | 首次输入延迟 |
| CLS | < 0.1 | 累积布局偏移 |
| TTI | < 3.8s | 可交互时间 |
详见 design-guide.md — AI 通用审美定义、设计思维方向矩阵、反模式清单与审查清单。
详见
rules/frontend/frontend-testing.md和rules/frontend/frontend-e2e.md(按文件类型自动加载)。
记住: 前端开发的核心是用户体验——性能、无障碍、交互细节缺一不可,独特的设计比通用模板更有价值。