VueJS - Configuration de l'environnement

Il existe de nombreuses façons d'installer VueJS. Certaines des manières de réaliser l'installation sont discutées à l'avance.

Utilisation de la balise <script> directement dans le fichier HTML

<html>
   <head>
      <script type = "text/javascript" src = "vue.min.js"></script>
   </head>
   <body></body>
</html>

Aller sur le site d'accueil https://vuejs.org/v2/guide/installation.htmlde VueJS et téléchargez le vue.js selon vos besoins. Il existe deux versions à utiliser: la version de production et la version de développement. La version de développement n'est pas réduite, tandis que la version de production est réduite comme indiqué dans la capture d'écran suivante. La version de développement aidera avec les avertissements et le mode de débogage pendant le développement du projet.

Utiliser CDN

Nous pouvons également commencer à utiliser le fichier VueJS de la bibliothèque CDN. Le lienhttps://unpkg.com/vuedonnera la dernière version de VueJS. VueJS est également disponible sur jsDelivr (https://cdn.jsdelivr.net/npm/vue/dist/vue.js) et cdnjs (https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.0/vue.js).

Nous pouvons héberger les fichiers de notre côté, si nécessaire et commencer le développement de VueJS.

Utilisation de NPM

Pour les applications à grande échelle avec VueJS, il est recommandé d'installer à l'aide du package npm. Il est livré avec Browserify et Webpack ainsi que d'autres outils nécessaires, qui aident au développement. Voici la commande à installer à l'aide de npm.

npm  install vue

Utilisation de la ligne de commande CLI

VueJS fournit également une CLI pour installer la vue et démarrer l'activation du serveur. Pour installer à l'aide de la CLI, nous devons avoir la CLI installée, ce qui se fait à l'aide de la commande suivante.

npm install --global vue-cli

Une fois cela fait, il affiche la version CLI pour VueJS. Cela prend quelques minutes pour l'installation.

+ [email protected]
added 965 packages in 355.414s

Voici la commande pour créer le projet à l'aide de Webpack.

vue init webpack myproject

Pour commencer, utilisez la commande suivante.

cd myproject
npm install
npm run dev

Une fois que nous exécutons npm run dev, il démarre le serveur et fournit l'URL à afficher dans le navigateur, comme illustré dans la capture d'écran suivante.

La structure du projet utilisant CLI ressemble à ce qui suit.