ClaudeVueCode Style

Vue.js Claude Rules

Claude rules for Vue 3: Composition API, Pinia, performance, and Vue ecosystem best practices.

CLAUDE.md
- Use Vue 3 Composition API with <script setup> for all components
- Manage global state with Pinia; use composables for reusable local state
- Use Nuxt 3 for full-stack Vue apps; leverage server routes and SSR
- Define and validate all component props; add defaults for optional props
- Use provide/inject for deep component communication instead of prop drilling
- Apply transition and animation system from Vue; avoid manual CSS transitions
- Use VueUse composables before writing custom browser API wrappers
- Write component tests with Vue Testing Library and Vitest

How to use with Claude

Create a `CLAUDE.md` file in your project root. Claude Code reads this on startup and follows your conventions throughout the session.

#vue#pinia#claude#composition-api#coding-rules

Related Rules