Agent skill
vue
Vue.js progressive JavaScript framework. Use when building Vue components, working with reactivity (ref, reactive, computed, watch), or implementing Vue Composition API patterns.
Stars
232
Forks
15
Install this agent skill to your Project
npx add-skill https://github.com/aiskillstore/marketplace/tree/main/skills/antfu/vue
Metadata
Additional technical details for this skill
- author
- Anthony Fu
- source
- Generated from https://github.com/vuejs/docs, scripts located at https://github.com/antfu/skills
- version
- 2026.1.28
SKILL.md
Vue
The skill is based on Vue 3.5+, generated at 2026-01-28.
Vue is a progressive JavaScript framework for building user interfaces. It builds on standard HTML, CSS, and JavaScript with intuitive API and world-class documentation. The Composition API with <script setup> and TypeScript is the recommended approach for building Vue applications.
Core References
| Topic | Description | Reference |
|---|---|---|
| Reactivity System | ref, reactive, computed, watch, and watchEffect | core-reactivity |
Components
| Topic | Description | Reference |
|---|---|---|
| Props | Declare and validate component props with TypeScript | components-props |
| Events (Emits) | Emit custom events from components | components-emits |
| Slots | Pass template content to child components | components-slots |
| v-model | Two-way binding on custom components | components-v-model |
| Lifecycle Hooks | Run code at specific component lifecycle stages | components-lifecycle |
Features
Script Setup & TypeScript
| Topic | Description | Reference |
|---|---|---|
| Script Setup | Composition API syntactic sugar for SFCs | features-script-setup |
| TypeScript | Type-safe Vue components with Composition API | features-typescript |
Reusability
| Topic | Description | Reference |
|---|---|---|
| Composables | Encapsulate and reuse stateful logic | features-composables |
| Custom Directives | Low-level DOM manipulation directives | features-directives |
| Template Refs | Direct DOM and component instance access | features-template-refs |
Advanced
| Topic | Description | Reference |
|---|---|---|
| Provide/Inject | Dependency injection across component tree | advanced-provide-inject |
| Async & Suspense | Top-level await pitfalls, async components, Suspense | advanced-async-suspense |
Key Recommendations
- Use
<script setup lang="ts">for all components - Prefer
ref()overreactive()for declaring state - Use type-based prop declarations with interfaces
- Use
defineModel()for v-model (3.4+) - Destructure props reactively (3.5+) for cleaner code
- Extract composables for reusable stateful logic
Didn't find tool you were looking for?