From gdu
Vue 3 Composition API patterns for components and composables. Activates on .vue files to enforce script setup, typed props/emits, and canonical section ordering. Use when creating or editing Vue components, composables, or template logic.
How this skill is triggered — by the user, by Claude, or both
Slash command
/gdu:vueThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
`<script setup lang="ts">` with section order: imports, props/emits, state, computed, methods, watchers, lifecycle.
<script setup lang="ts"> with section order: imports, props/emits, state, computed, methods, watchers, lifecycle.
Props — generic typed: defineProps<{ name: Type }>().
Emits — typed: defineEmits<{ event: [payload: Type] }>().
v-model — defineModel<T>(), never manual prop+emit pair.
Composables — use prefix, return reactive refs.
Store destructuring — storeToRefs(store) for state, store.action() for actions.
ui prop — override component slots: <UButton :ui="{ base: 'font-bold' }" />class prop — override root/base slot onlyWhen CELLM_DEV_MODE: true: after component implementation, write feedback entry to dev-cellm-feedback/entries/vue-{date}-{seq}.md. Note which Composition API patterns caused friction, whether typed props/emits caught real issues, and which Vue 3 conventions were misapplied. Format and lifecycle: see dev-cellm-feedback/README.md.
data(), methods:, computed:, watch:defineProps(['name'])any — use unknown + type guards<script> without setup — always <script setup lang="ts">storeToRefs — loses reactivityclassName — Vue uses class, not React's classNamenpx claudepluginhub murillodutt/cellm --plugin gduDelivers Vue 3 best practices for Composition API script setup, composables, ref/reactive patterns, Pinia state management, and Nuxt apps. Activates on .vue files and Vue triggers.
Guides Vue.js 3 Composition API patterns, component architecture, reactivity, Pinia state management, Vue Router, and Nuxt SSR. Activates for Vue, Nuxt, Vite, or Pinia projects.
Provides Vue 3 expertise on Composition API, Pinia stores, Nuxt 3, Vue Router, custom directives, provide/inject, transitions, and Volar config. Use for building components, state design, routing, and reactivity debugging.