Qu'est-ce qui est généré une fois que vue est empaquetée ?

Vue est un framework JavaScript open source conçu pour développer des applications monopage. À mesure que Vue continue de se développer, les développeurs commencent à se concentrer sur la façon de l'emballer et de le déployer dans un environnement de production. Cet article présentera certains fichiers et dossiers générés après le packaging de Vue.

Outils pour empaqueter les applications Vue

Avant d'introduire les fichiers générés, nous devons d'abord présenter l'outil pour empaqueter les applications Vue - Webpack. Webpack est un outil d'empaquetage de modules statiques qui convertit tous les fichiers requis en ressources statiques et les regroupe dans un ou plusieurs packages. Dans les projets Vue, nous utilisons souvent Webpack pour le packaging.

Fichiers et dossiers emballés

Après avoir empaqueté l'application Vue, vous verrez un dossier appelé "dist". Ce dossier contient le code et les ressources de l'ensemble de l'application packagée, qui constitue la base de code déployée sur le serveur. Jetons un coup d'œil à quelques fichiers et dossiers importants dans le dossier « dist ».

index.html

index.html est le fichier d'entrée de votre candidature. Ce fichier est le seul fichier HTML généré par le packaging Webpack. Il contient tout le code JavaScript et CSS de l'application Vue, ainsi que les scripts et balises utilisés pour charger ces fichiers.

Fichiers JS

Les fichiers JS sont tous le code JavaScript de votre application Vue. Il existe deux fichiers JavaScript principaux dans un projet Vue : app.js et supplier.js. app.js contient vos composants Vue et tout le code logique de votre application. supplier.js contient des bibliothèques et des dépendances tierces.

Fichiers CSS

Les fichiers CSS sont les feuilles de style de votre application Vue. Il y a généralement deux fichiers CSS principaux dans un projet Vue : app.css et supplier.css. app.css contient tous les styles de votre application et supplier.css contient les styles des bibliothèques et dépendances tierces.

dossier statique

le dossier statique contient toutes les ressources statiques de l'application, telles que des images et des fichiers de polices. Ces fichiers sont fréquemment utilisés dans les applications Web.

Résumé

Dans les applications Vue, Webpack est l'outil utilisé pour empaqueter et créer du code. Il convertit tous les fichiers requis en ressources statiques et les regroupe en un ou plusieurs packages. Une fois l'empaquetage terminé, les fichiers HTML, JavaScript et CSS avec le code de l'application Vue seront générés dans le dossier « dist ». Nous pouvons également trouver toutes les ressources statiques dans le dossier static. Sachant cela, vous pouvez mieux comprendre et déployer votre code lorsque vous utilisez Vue pour le développement d'applications.

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!