Les outils de développement de Vue incluent : 1. Vue CLI ; 2. Vue Press ; 3. Vuex ; 5. Vuetify ; 7. Storybook ;
L'environnement d'exploitation de ce tutoriel : système Windows 7, vue version 2.9.6, ordinateur DELL G3.
En plus de JavaScript, le front-end dispose désormais également de trois frameworks, React, Vue et Angular, qui sont plus couramment utilisés sur le marché. On peut dire que ces trois frameworks ont changé le statut du front-end. dans une large mesure. Comparé à angulaire, vue Il contient également une multitude d'instructions et est un framework MVC typique.
Vue est actuellement utilisé par de nombreux développeurs et devient de plus en plus populaire, donc son environnement écologique. est également devenu plus complet. Il existe également de nombreux outils associés, qui s'appuient principalement sur la courbe d'apprentissage de Vue et sur une structure de conception et une documentation d'utilisation claires, permettant aux développeurs expérimentés de démarrer facilement à partir d'autres frameworks. Laissez-moi vous présenter quels sont les outils de développement de vue ?
Vue CLI
Afin de permettre aux développeurs de démarrer rapidement, il fournit des outils d'échafaudage de type CLI comme l'étrange framework VueCLI est un ensemble d'outils entièrement fonctionnels qui peuvent être utilisés pour le développement rapide de Vue. La base d'outils de l'écosystème Vue garantit que divers outils de construction peuvent être connectés en douceur sur la base de configurations par défaut intelligentes, afin que vous puissiez vous concentrer sur l'écriture d'applications sans avoir à vous soucier des problèmes de configuration. Par exemple, vous pouvez rapidement intégrer facilement le plug. -ins tels que Babel, TypeScript, ESLint, PostCSS, Jest, Mocha, Nightwatch et Cypress.
Vue Press
VuePress est un générateur de sites Web statiques piloté par Vue. Il s'agit d'une application monopage pilotée par Vue, Vue Router et webpack. Dans VuePress, vous pouvez utiliser Markdown pour rédiger des documents puis générer des pages Web. Chaque page est générée par Les pages générées par VuePress ont du HTML pré-rendu, elles ont donc de très bonnes performances de chargement et une optimisation des moteurs de recherche. En même temps, une fois la page chargée, Vue reprendra le contenu et le convertira en un fichier HTML. application complète d'une seule page. , les autres pages ne doivent être chargées que lorsque l'utilisateur y accède
Vuex
Dans le développement de composants SPA d'une seule page, Vuex de Vue et React de React sont collectivement appelés la même gestion d'état. , qui peut également être appelé gestion globale de l'état, une compréhension simple est qu'après avoir défini une donnée dans l'état, vous pouvez l'obtenir et la modifier dans n'importe quel composant du projet, et la partie modifiée peut obtenir des changements de réponse globale à chaque Vuex. application Le noyau est le Store, qui peut être utilisé comme conteneur et contient la majeure partie de l'état de l'application.
Nuxt
Nuxt.js est un framework d'application léger basé sur Vue.js. Il peut être utilisé pour créer des applications de rendu côté serveur. Il peut également agir comme un moteur de site statique pour générer des applications de site statiques. une superposition de structure de code élégante et un chargement à chaud et d'autres fonctionnalités.
Vuetify
Vuetify est actuellement l'une des meilleures bibliothèques de composants d'interface utilisateur basées sur VEU. Elle fournit un grand nombre de composants soigneusement conçus sur la base des spécifications de Material Design, qui peuvent répondre aux besoins de n'importe quelle application.
Quasar
Quasar est un framework open source sous licence MIT basé sur Vue qui peut aider les développeurs Web à créer des sites Web réactifs, des PWA pour créer des applications mobiles via Apacha Cordova, des applications multiplateformes Quasar oblige les développeurs à écrire du code environ une fois, puis utilisez la même base de code pour déployer simultanément en tant que site Web, PWA, application mobile et application Electron. Utilisez la CLI la plus avancée pour concevoir des applications et fournir des composants Web Quasar soigneusement écrits et très rapides,
Storybook
Pour la section précédente, la technologie de composantisation est déjà un cours obligatoire, parmi lesquels je me concentre principalement sur React et Vue, mais J'ai généralement quelques problèmes lors du développement de composants, en particulier de composants publics ou tiers.
Je ne peux pas très bien gérer les composants, je ne peux pas les voir clairement d'un coup d'œil, ni bien y répondre. états des composants,
Les tests d'interaction automatisés peuvent utiliser une enzyme, mais vous devez souvent tester manuellement,
Lors de la rédaction de documents, vous devez écrire l'aperçu du composant et le document ensemble, et vous devez changer d'état,
Ainsi, storbook a émergé pour résoudre ces problèmes. Il peut créer un environnement de développement puissant pour les composants et fournit principalement les points suivants
Fournit une puissante page de gestion des composants de l'interface utilisateur qui peut être regroupée de manière très pratique et claire. composants ou différents états d'un composant
En plus des tests d'interaction automatisés, des tests d'interaction manuels peuvent être facilement effectués et les paramètres des composants peuvent être modifiés dynamiquement pour afficher les modifications
Vous pouvez exporter des aperçus de composants sous forme de ressources statiques, afin que vous puissiez facilement visualiser la documentation du composant et les différentes vues correspondant aux différents paramètres, ainsi qu'une série de plug-ins pour mieux nous aider à mener à bien le travail de développement, de test et d'optimisation des composants.
Cet outil permet aux développeurs de les afficher de manière interactive indépendamment des principaux composants de l'application dans un environnement de développement isolé sans avoir à se soucier des dépendances et des exigences spécifiques à l'application, ce qui le rend pratique pour les développeurs, les concepteurs, etc. Les gens participent aux projets.
Visual Studio Code
Visual Studio Code ("VS Code" en abrégé) est un programme officiellement annoncé par Microsoft lors de la Build Developer Conference du 30 avril 2015, qui fonctionne sur Mac OS X, Windows et Linux A. éditeur de code source multiplateforme pour écrire des applications Web et cloud modernes qui s'exécutent sur le bureau et sont disponibles pour Windows, macOS et Linux. Il prend en charge JavaScript, TypeScript et Node.js, ainsi qu'un riche écosystème d'extensions pour d'autres langages (tels que C++, C#, Java, Python, PHP, Go) et des environnements d'exécution (tels que .NET et Unité).
WebStorm
WebStorm est un outil de développement JavaScript appartenant à JetBrains. Il a été salué par la majorité des développeurs JS chinois comme « artefact de développement frontal Web », « l'éditeur HTML5 le plus puissant », « l'IDE JavaScript le plus intelligent », etc. Il a la même origine qu'IntelliJ IDEA et hérite des fonctions de la puissante partie JS d'IntelliJ IDEA.
Recommandations associées : "Tutoriel vue.js"
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!