scaffold-frontend-component
OfficialScaffold Vue 3 components per project conventions
Authorbbvch-ai
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill eliminates the risk of inconsistent Vue 3 component implementation that leads to UI bugs, design system drift, and technical debt when developers manually create components without adhering to project-specific conventions for PrimeVue, Tailwind CSS, i18n, and typed SDK integration.
Core Features & Use Cases
- Multi-pattern component scaffolding: Supports card, modal/dialog, list/DataTable, form, empty card, and display component patterns out of the box, with pre-built templates for each.
- Built-in convention enforcement: Automatically applies project rules including Composition API with TypeScript, typed props/emits using SDK types from @core/sdk/client, PrimeVue-only UI elements, Tailwind CSS with mandatory dark mode variants, and i18n for all user-facing text.
- Use Case: Imagine your team needs to add a new "Pipeline" card component to the resource grid. Use this Skill to generate a fully compliant component in seconds, with correct domain-based file placement, active state synced to route params, and proper event handling, no manual boilerplate work required.
Quick Start
Use the scaffold-frontend-component skill to generate a new Pipeline Card component following the project's standard card pattern conventions.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: scaffold-frontend-component Download link: https://github.com/bbvch-ai/aihub-core/archive/main.zip#scaffold-frontend-component Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 536,000+ vetted skills library on demand.