vue-create-component

Generate typed, reusable Vue 3 components with defineProps and defineEmits.

1|Updated Mar 18, 2026
One-click install
npx skills add https://github.com/bmslabs/bmlabs-projects-templates --skill vue-create-component
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vue-create-component
Source: https://github.com/bmslabs/bmlabs-projects-templates/tree/main/view-vuejs/.github/skills/vue-create-component
Command: npx skills add https://github.com/bmslabs/bmlabs-projects-templates --skill vue-create-component

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Los equipos de desarrollo gastan tiempo creando componentes Vue 3 repetitivos y propensos a errores; este Skill automatiza la generación de componentes tipados y reutilizables, asegurando consistencia entre proyectos.

Core Features & Use Cases

  • Generación de componentes Vue 3 tipados con setup script y defineProps/defineEmits.
  • Soporte para props, emits, withDefaults y opcional v-model, con validación de tipos y accesibilidad.
  • Generación de archivos SFC completos y utilidades de pruebas cuando aplica, siguiendo las convenciones del proyecto.

Quick Start

Ejecuta /vue-create-component [Nombre] para generar un componente base.

Frequently Asked Questions about vue-create-component

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate reusable Vue 3 components with TypeScript and Tailwind?

To generate reusable Vue 3 components with TypeScript and Tailwind, this Skill automates SFC creation using script setup, defineProps, and defineEmits. It outputs strongly-typed code with defaults and accessibility considerations to reduce boilerplate.

Can I build type-safe Vue 3 components with v-model support automatically?

Yes, you can build type-safe Vue 3 components with optional v-model support automatically. This Skill generates complete single-file components using TypeScript validation, defineProps, and defineEmits to ensure strict type safety and reusability.

Does this Vue component generator support accessibility and default props?

Yes, this Vue component generator supports accessibility and default props. It uses withDefaults for prop defaults and enforces accessibility considerations alongside corporate UI patterns to ensure consistent, reusable TypeScript components.

What is the best way to enforce consistency when creating Vue 3 UI components?

The best way to enforce consistency when creating Vue 3 UI components is automating generation with this Skill. It standardizes script setup syntax, TypeScript typing, and Tailwind styling across common categories like ui, form, and layout components.

Do I need TypeScript to use this Vue 3 component generation Skill?

Yes, you need TypeScript to use this Vue 3 component generation Skill effectively. It is designed for Vue 3 projects using TypeScript and Tailwind, generating strongly-typed SFCs with type definitions and test utilities when applicable.

What categories of Vue 3 components can I automate for my project?

You can automate common categories of Vue 3 components including ui, form, layout, and feature components. The Skill generates strongly-typed SFCs with TypeScript, Tailwind styling, and accessibility considerations for each category.