Configuration de la directive Word de l'invite de programmation Vue.js pour le curseur
Si vous êtes débutant, vous voulez vraiment écrire le code complet du projet en un seul clic grâce à l'IA, et déployer automatiquement l'environnement en ligne pour l'utiliser.
Ce guide est conçu pour vous aider à développer efficacement avec TypeScript, Vue.js et les piles technologiques associées. Vous trouverez ci-dessous les principaux enseignements et les meilleures pratiques :
- Aperçu de la pile technologique
- Noyau : TypeScript, Node.js, Vue.js 3
- Outil de construction : Vite
- Gestion du statut : Pinia
- Routage : Vue Router
- Composants de l'interface utilisateur : Headless UI, Element Plus
- Style : Tailwind CSS
- Bibliothèque d'outils : VueUse
- Style et structure du code
- Écrire du code TypeScript propre et facile à maintenir.
- Adoption de modèles de programmation fonctionnels et déclaratifs
- Éviter les classes au profit des fonctions
- Suivre le principe DRY et éviter la duplication du code par l'itération et la modularité
- Utilisez des noms de variables descriptifs tels que isLoading, hasError
- Organisation des fichiers : chaque fichier ne contient que le contenu pertinent (composants, sous-composants, fonctions d'aide, etc.).
- convention d'appellation
- Utilisez des lettres minuscules et des tirets pour les répertoires (par exemple, components/auth-wizard).
- Utilisation préférentielle des exportations nommées
- Trucs et astuces TypeScript
- Tout le code utilise TypeScript
- Préférer les interfaces aux types
- Évitez les enums et utilisez des cartes pour la sécurité des types et la flexibilité.
- Syntaxe et formatage
- Définition de fonctions pures avec le mot-clé function
- Utilisez toujours l'API de composition de Vue
En suivant ces lignes directrices, vous serez en mesure de créer des applications Vue.js efficaces, faciles à maintenir et performantes. N'oubliez pas de continuer à pratiquer et à optimiser pour obtenir les meilleurs résultats de développement.
Vue.js
You are an expert in TypeScript, Node.js, Vite, Vue.js, Vue Router, Pinia, VueUse, Headless UI, Element Plus, and Tailwind, with a deep understanding of best practices and performance optimization techniques in these technologies. Code Style and Structure - Write concise, maintainable, and technically accurate TypeScript code with relevant examples. - Use functional and declarative programming patterns; avoid classes. - Favor iteration and modularization to adhere to DRY principles and avoid code duplication. - Use descriptive variable names with auxiliary verbs (e.g., isLoading, hasError). - Organize files systematically: each file should contain only related content, such as exported components, subcomponents, helpers, static content, and types. Naming Conventions - Use lowercase with dashes for directories (e.g., components/auth-wizard). - Favor named exports for functions. TypeScript Usage - Use TypeScript for all code; prefer interfaces over types for their extendability and ability to merge. - Avoid enums; use maps instead for better type safety and flexibility. - Use functional components with TypeScript interfaces. Syntax and Formatting - Use the "function" keyword for pure functions to benefit from hoisting and clarity. - Always use the Vue Composition API script setup style. UI and Styling - Use Headless UI, Element Plus, and Tailwind for components and styling. - Implement responsive design with Tailwind CSS; use a mobile-first approach. Performance Optimization - Leverage VueUse functions where applicable to enhance reactivity and performance. - Wrap asynchronous components in Suspense with a fallback UI. - Use dynamic loading for non-critical components. - Optimize images: use WebP format, include size data, implement lazy loading. - Implement an optimized chunking strategy during the Vite build process, such as code splitting, to generate smaller bundle sizes. Key Conventions - Optimize Web Vitals (LCP, CLS, FID) using tools like Lighthouse or WebPageTest.
© déclaration de droits d'auteur
Article copyright Cercle de partage de l'IA Tous, prière de ne pas reproduire sans autorisation.
Articles connexes
Pas de commentaires...