vue 3 nuxt 3 typescript
via PatrickJS/awesome-cursorrules
Vue 3 + Nuxt 3 + TypeScript development patterns and best practices
What is vue 3 nuxt 3 typescript?
Establishes conventions for building Vue 3 applications with Nuxt 3 and TypeScript, covering component structure, type safety, routing, styling, and build optimization. Use this rule to maintain consistency across a Nuxt 3 project and leverage TypeScript for type-safe development.
- Use Composition API with `<script setup>` for modern component patterns
- Define TypeScript interfaces for type-safe object shapes and keep types colocated with features
- Follow Nuxt conventions for routing, layouts, composables, plugins, server routes, and runtime config
- Apply responsive and accessible Tailwind CSS aligned with project design system
- Leverage VueUse utilities to simplify reactivity without obscuring state changes
- Optimize builds with lazy loading, dynamic imports, image optimization, and bundle analysis
Applies to
File patterns this rule matches.
Rule definition (reference)
Source of truth, from the repository.
Vue 3 Nuxt 3 TypeScript Guidelines
- Use Vue 3 Composition API patterns with
<script setup>and clear component boundaries. - Prefer TypeScript interfaces for object shapes and keep shared types close to the feature that owns them.
- Use Nuxt conventions for routing, layouts, composables, plugins, server routes, and runtime config.
- Keep Tailwind CSS usage responsive, accessible, and consistent with the project design system.
- Use VueUse utilities where they simplify reactivity without hiding important state transitions.
- Optimize Vite/Nuxt builds with lazy loading, dynamic imports, image optimization, and bundle review.
Related rules
Senior full-stack TypeScript, React, Node.js guidance with clean architecture, testing, and WHY-oriented reasoning.
Quantitative factor research skills for designing, evaluating, and mining alpha factors in equities markets.
Android development with Jetpack Compose, clean architecture, and Material Design 3.
Angular development with Novo Elements UI library using standalone components.
Expert Angular 18 + TypeScript development with Jest, emphasizing clean code and performance.
Manage Kubernetes clusters, add-ons, stacks, and credentials via the Ankra CLI platform.