Vue.js 3 Coding Conventions

vuevue3composition-apifrontend

Coding standards and best practices for Vue 3 with Composition API

Целевые файлы

Файл	Формат
.cursorrules	plaintext
CLAUDE.md	markdown

Содержимое

Use Composition API with <script setup> syntax for all new components. Define props with defineProps<{...}>() using TypeScript interfaces, not runtime validation. Use defineEmits<{...}>() with typed event signatures for all emitted events. Prefix reactive refs with no Hungarian notation; use descriptive names (count, not countRef). Extract reusable logic into composables in /composables, prefixed with "use" (useAuth). Keep components under 200 lines; split presentation from logic into composables. Use computed() for derived state; never compute values directly in templates. Avoid watchers where computed properties suffice; watchers are for side effects only. Use provide/inject for deep prop drilling (more than 2 levels), not prop drilling. Always specify a :key when using v-for; never use array index as key for mutable lists. Never use v-if and v-for on the same element; wrap with a template tag. Use PascalCase for component names in templates and file names. Prefix private composable-internal refs with underscore to signal no external use. Use Pinia for shared state; avoid Vuex and manual reactive global objects.

CLI

npx mindaxis apply vue-rules --target cursor --scope project