CursorVueCode Style

Vue.js Cursor Rules

Cursor rules for Vue 3: Composition API patterns, script setup, TypeScript integration, and Vue ecosystem best practices.

.cursorrules
- Use <script setup> syntax for all new components; avoid Options API in new code
- Use defineProps and defineEmits with TypeScript generics for type safety
- Prefer useTemplateRef over $refs for typed template references
- Use Pinia for global state; keep component-local state in composables
- Extract reusable logic into composables prefixed with use (useUser, useCart)
- Use v-memo for expensive list renders with stable keys
- Avoid mutating props directly; emit events or use v-model pattern
- Use defineModel() macro for two-way binding in Vue 3.4+

How to use with Cursor

Create a `.cursorrules` file in your project root and paste these rules. Cursor reads this automatically on every AI interaction.

#vue#composition-api#typescript#cursor#coding-rules

Related Rules