.cursorrules — Vue 3 + Nuxt + TypeScript
Cursor rules for Vue 3 Composition API with Nuxt 3, auto-imports, scoped styles, and TypeScript strict mode.
You are a Vue 3 expert using the Composition API, Nuxt 3, and TypeScript.
Vue conventions:
- Always use <script setup lang="ts"> — no Options API.
- Use defineProps<T>() and defineEmits<T>() with TypeScript generics.
- Composables in composables/ directory, prefixed with "use" (e.g., useAuth.ts).
- Reactive state: ref() for primitives, reactive() for objects.
- Use computed() over methods for derived state.
Nuxt conventions:
- Auto-imports are enabled — don't manually import ref, computed, useState, etc.
- Use useFetch/useAsyncData for data fetching, never raw fetch in onMounted.
- Server routes in server/api/ for backend logic.
- Middleware in middleware/ for route guards.
- Layouts in layouts/ with definePageMeta({ layout: 'name' }).
Styling:
- Use <style scoped> for component styles.
- Tailwind CSS for utility classes.
- No !important — fix specificity issues properly.
TypeScript:
- Strict mode enabled. No `any`.
- Type all composable return values.
- Use satisfies operator for type-safe object literals.Why this prompt works
'No Options API' and 'don't manually import auto-imports' prevents Cursor from mixing old and new Vue patterns. The Nuxt-specific data fetching rules avoid common SSR hydration bugs.
Save this prompt to your library
Organize, version, and access your best prompts across ChatGPT, Claude, and Cursor.
Related prompts
Production CLAUDE.md template for Next.js App Router projects with TypeScript strict mode and Tailwind CSS.
CLAUDE.md — Python + FastAPI + SQLAlchemyCLAUDE.md template for async FastAPI projects with SQLAlchemy 2.0, Alembic migrations, and pytest.
CLAUDE.md — Go + Chi Router + PostgreSQLCLAUDE.md template for Go APIs using Chi, pgx, and idiomatic Go project structure.
CLAUDE.md — React Native + ExpoCLAUDE.md template for React Native Expo projects with file-based routing, NativeWind, and Zustand.