{"filename":"vue.mdc","content":"---\ndescription: \"Vue.js best practices and patterns for modern web applications\"\nglobs: **/*.vue, **/*.ts, components/**/*\nalwaysApply: false\n---\n# Vue.js Best Practices\n\n## Component Structure\n- Use Composition API over Options API\n- Keep components small and focused\n- Use proper TypeScript integration\n- Implement proper props validation\n- Use proper emit declarations\n- Keep template logic minimal\n\n## Composition API\n- Use proper ref and reactive\n- Implement proper lifecycle hooks\n- Use composables for reusable logic\n- Keep setup function clean\n- Use proper computed properties\n- Implement proper watchers\n\n## State Management\n- Use Pinia for state management\n- Keep stores modular\n- Use proper state composition\n- Implement proper actions\n- Use proper getters\n- Handle async state properly\n\n## Performance\n- Use proper component lazy loading\n- Implement proper caching\n- Use proper computed properties\n- Avoid unnecessary watchers\n- Use proper v-show vs v-if\n- Implement proper key management\n\n## Routing\n- Use Vue Router properly\n- Implement proper navigation guards\n- Use proper route meta fields\n- Handle route params properly\n- Implement proper lazy loading\n- Use proper navigation methods\n\n## Forms\n- Use v-model properly\n- Implement proper validation\n- Handle form submission properly\n- Show proper loading states\n- Use proper error handling\n- Implement proper form reset\n\n## TypeScript Integration\n- Use proper component type definitions\n- Implement proper prop types\n- Use proper emit declarations\n- Handle proper type inference\n- Use proper composable types\n- Implement proper store types\n\n## Testing\n- Write proper unit tests\n- Implement proper component tests\n- Use Vue Test Utils properly\n- Test composables properly\n- Implement proper mocking\n- Test async operations\n\n## Best Practices\n- Follow Vue style guide\n- Use proper naming conventions\n- Keep components organized\n- Implement proper error handling\n- Use proper event handling\n- Document complex logic\n\n## Build and Tooling\n- Use Vite for development\n- Configure proper build setup\n- Use proper environment variables\n- Implement proper code splitting\n- Use proper asset handling\n- Configure proper optimization\n"}