[docs] Convert .cursorrules to standard markdown format (#4099)

This commit is contained in:
Christian Byrne
2025-06-07 19:45:03 -07:00
committed by GitHub
parent 6bbe46009b
commit 3eee7cde0b

View File

@@ -1,26 +1,25 @@
// Vue 3 Composition API .cursorrules
# Vue 3 Composition API Project Rules
// Vue 3 Composition API best practices
const vue3CompositionApiBestPractices = [
"Use setup() function for component logic",
"Utilize ref and reactive for reactive state",
"Implement computed properties with computed()",
"Use watch and watchEffect for side effects",
"Implement lifecycle hooks with onMounted, onUpdated, etc.",
"Utilize provide/inject for dependency injection",
"Use vue 3.5 style of default prop declaration. Example:
## Vue 3 Composition API Best Practices
- Use setup() function for component logic
- Utilize ref and reactive for reactive state
- Implement computed properties with computed()
- Use watch and watchEffect for side effects
- Implement lifecycle hooks with onMounted, onUpdated, etc.
- Utilize provide/inject for dependency injection
- Use vue 3.5 style of default prop declaration. Example:
```typescript
const { nodes, showTotal = true } = defineProps<{
nodes: ApiNodeCost[]
showTotal?: boolean
}>()
```
",
"Organize vue component in <template> <script> <style> order",
]
- Organize vue component in <template> <script> <style> order
// Folder structure
const folderStructure = `
## Project Structure
```
src/
components/
constants/
@@ -30,30 +29,25 @@ src/
services/
App.vue
main.ts
`;
```
// Tailwind CSS best practices
const tailwindCssBestPractices = [
"Use Tailwind CSS for styling",
"Implement responsive design with Tailwind CSS",
]
## Styling Guidelines
- Use Tailwind CSS for styling
- Implement responsive design with Tailwind CSS
// PrimeVue deprecated components - DO NOT USE
const deprecatedPrimeVueComponents = [
"DO NOT use deprecated PrimeVue components. Use these replacements instead:",
"Dropdown → Use Select (import from 'primevue/select')",
"OverlayPanel → Use Popover (import from 'primevue/popover')",
"Calendar → Use DatePicker (import from 'primevue/datepicker')",
"InputSwitch → Use ToggleSwitch (import from 'primevue/toggleswitch')",
"Sidebar → Use Drawer (import from 'primevue/drawer')",
"Chips → Use AutoComplete with multiple enabled and typeahead disabled",
"TabMenu → Use Tabs without panels",
"Steps → Use Stepper without panels",
"InlineMessage → Use Message component"
]
## PrimeVue Component Guidelines
DO NOT use deprecated PrimeVue components. Use these replacements instead:
- Dropdown → Use Select (import from 'primevue/select')
- OverlayPanel → Use Popover (import from 'primevue/popover')
- Calendar → Use DatePicker (import from 'primevue/datepicker')
- InputSwitch → Use ToggleSwitch (import from 'primevue/toggleswitch')
- Sidebar → Use Drawer (import from 'primevue/drawer')
- Chips → Use AutoComplete with multiple enabled and typeahead disabled
- TabMenu → Use Tabs without panels
- Steps → Use Stepper without panels
- InlineMessage → Use Message component
// Additional instructions
const additionalInstructions = `
## Development Guidelines
1. Leverage VueUse functions for performance-enhancing styles
2. Use lodash for utility functions
3. Use TypeScript for type safety
@@ -63,7 +57,5 @@ const additionalInstructions = `
7. Implement proper error handling
8. Follow Vue 3 style guide and naming conventions
9. Use Vite for fast development and building
10. Use vue-i18n in composition API for any string literals. Place new translation
entries in src/locales/en/main.json.
10. Use vue-i18n in composition API for any string literals. Place new translation entries in src/locales/en/main.json
11. Never use deprecated PrimeVue components listed above
`;