Agent Skills
› uni-helper/skills
› vue
vue
GitHubVue.js 3.5+ 开发技能，涵盖组件构建、响应式系统、Composition API 及 TypeScript 最佳实践。
触发场景
需要创建 Vue 组件
使用 Composition API 或 Script Setup
实现 Vue 响应式逻辑
安装
npx skills add uni-helper/skills --skill vue -g -y
SKILL.md
Frontmatter
{
"name": "vue",
"metadata": {
"author": "Anthony Fu",
"source": "Generated from https:\/\/github.com\/vuejs\/docs, scripts located at https:\/\/github.com\/antfu\/skills",
"version": "2026.1.28"
},
"description": "Vue.js progressive JavaScript framework. Use when building Vue components, working with reactivity (ref, reactive, computed, watch), or implementing Vue Composition API patterns."
}
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
版本历史
- 15909ff 当前 2026-07-24 12:22
