diff --git a/.cursor/rules/vue.mdc b/.cursor/rules/vue.mdc new file mode 100644 index 0000000..54d4538 --- /dev/null +++ b/.cursor/rules/vue.mdc @@ -0,0 +1,86 @@ +--- +description: Vue.js best practices and patterns for modern web applications +globs: **/*.vue, **/*.ts, components/**/* +--- + +# Vue.js Best Practices + +## Component Structure +- Use Composition API over Options API +- Keep components small and focused +- Use proper TypeScript integration +- Implement proper props validation +- Use proper emit declarations +- Keep template logic minimal + +## Composition API +- Use proper ref and reactive +- Implement proper lifecycle hooks +- Use composables for reusable logic +- Keep setup function clean +- Use proper computed properties +- Implement proper watchers + +## State Management +- Use Pinia for state management +- Keep stores modular +- Use proper state composition +- Implement proper actions +- Use proper getters +- Handle async state properly + +## Performance +- Use proper component lazy loading +- Implement proper caching +- Use proper computed properties +- Avoid unnecessary watchers +- Use proper v-show vs v-if +- Implement proper key management + +## Routing +- Use Vue Router properly +- Implement proper navigation guards +- Use proper route meta fields +- Handle route params properly +- Implement proper lazy loading +- Use proper navigation methods + +## Forms +- Use v-model properly +- Implement proper validation +- Handle form submission properly +- Show proper loading states +- Use proper error handling +- Implement proper form reset + +## TypeScript Integration +- Use proper component type definitions +- Implement proper prop types +- Use proper emit declarations +- Handle proper type inference +- Use proper composable types +- Implement proper store types + +## Testing +- Write proper unit tests +- Implement proper component tests +- Use Vue Test Utils properly +- Test composables properly +- Implement proper mocking +- Test async operations + +## Best Practices +- Follow Vue style guide +- Use proper naming conventions +- Keep components organized +- Implement proper error handling +- Use proper event handling +- Document complex logic + +## Build and Tooling +- Use Vite for development +- Configure proper build setup +- Use proper environment variables +- Implement proper code splitting +- Use proper asset handling +- Configure proper optimization \ No newline at end of file diff --git a/README.md b/README.md index bea161b..8220df6 100644 --- a/README.md +++ b/README.md @@ -3,3 +3,7 @@ Context for all the technical info, mostly found in git repos See ./.cursor/rules/README.mdc + +Kudos: + +- Some of the .mdc files are templates from https://github.com/PatrickJS/awesome-cursorrules