vue
2
总安装量
2
周安装量
#72536
全站排名
安装命令
npx skills add https://github.com/marsidev/skills --skill vue
Agent 安装分布
trae
2
kilo
2
antigravity
2
github-copilot
2
windsurf
2
codex
2
Skill 文档
Vue 3 Development
Based on Vue 3.5+. Always use Composition API with
<script setup lang="ts">.
Preferences
- Always
<script setup lang="ts">â no Options API - TypeScript for all component logic
- Prefer
shallowRefoverrefwhen deep reactivity is not needed - Prefer Tailwind utility classes over custom CSS
- Avoid reactive props destructure â use
const props = defineProps<Props>() - Function declarations (
function handleClick()) over arrow functions for component methods - Early returns over if/else blocks
Quick Template
<script setup lang="ts">
import { ref, computed, onMounted } from 'vue'
const props = defineProps<{
title: string
count?: number
}>()
const emit = defineEmits<{
update: [value: string]
}>()
const model = defineModel<string>()
const doubled = computed(() => (props.count ?? 0) * 2)
onMounted(() => {
// ...
})
</script>
<template>
<div>{{ title }} - {{ doubled }}</div>
</template>
References
Load only the file relevant to your current task:
Conventions
| Topic | Description | Reference |
|---|---|---|
| Code Organization | Script setup ordering, template rules, styling, naming conventions | conventions |
API
| Topic | Description | Reference |
|---|---|---|
| Script Setup Macros | defineProps, defineEmits, defineModel, defineExpose, defineOptions, defineSlots, generics | macros |
| Reactivity & Lifecycle | ref, shallowRef, computed, watch, watchEffect, composable patterns, effect scope | reactivity |
Patterns
| Topic | Description | Reference |
|---|---|---|
| Component Patterns | Async emit callbacks, v-model patterns, slot usage, loading states | patterns |
Gotchas
| Topic | Description | Reference |
|---|---|---|
| Common Pitfalls | Reactivity traps, computed mistakes, watcher timing, TypeScript, Tailwind, performance | gotchas |
When to Load
- Editing a
.vuecomponent â conventions + macros - Writing a composable â reactivity
- Implementing parent-child communication â patterns
- Something isn’t working as expected â gotchas
Do not load all references at once.