Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

Découvrir Vue.js 2

Utiliser l'outil en ligne de commande Vue-cli

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Vue-cli apporte une touche de simplicité à l'utilisation de Vue.js 2. Maîtrisez les commandes pour travailler plus vite.
03:56

Transcription

Il existe une autre méthode pour démarrer un projet. Alors vous avez vu l’installation très simple, nous on va simplement télécharger une librairie, une bibliothèque Vue et puis on va, à ce moment-là, poum directement le lier. On peut également utiliser un outil en ligne de commande. Alors, comment on va l’utiliser cet outil ? Bien regardez, sur la documentation, vous allez descendre un petit peu et vous allez voir qu’ici effectivement, on a la possibilité d’utiliser un outil en ligne de commande qui s’appelle "vue cli", donc c’est "vue cli" et on va pouvoir l’installer avec NPM. Alors, comment faire ça ? Bien c’est très facile, on va faire "npm i" pour install "-g" pour lui dire qu’on le veut de façon globale et on va utiliser "vue-cli" pour faire l’installation. Alors quand vous allez installer comme ça, faites attention, de temps en temps vous serez obligé encore une fois de préfixer avec sudo mais dans la plupart des cas, ça va fonctionner ; il va télécharger toutes les dépendances et à partir de l’installation, une fois que ce sera fait, vous aurez accès à cet outil en ligne de commande. Qu’est-ce qu’il permet cet outil en ligne de commande ? Bien, il y a l’anti-site Internet qui permet d’avoir plus d’informations sur cet outil en ligne de commande qui s’appelle donc "vue-cli" et qui vous donnera ici toutes les informations d’usage, ce que vous pouvez faire et notamment vous aurez possibilité de démarrer des projets avec des templates qui sont déjà des templates disponibles, notamment un projet incluant webpack – un projet incluant webpack mais en une version un peu simple –, un projet incluant browserify ou un projet browserify simple ou alors encore, tout simplement un projet simple. Le projet simple, ce sera le plus simple possible avec juste Vue qui sera installé et puis un fichier HTML. Alors c’est intéressant de pouvoir démarrer avec des templates tout faits parce que ça vous permet d’avoir des exemples et ça vous permet de savoir quoi faire. Alors vous voyez ici, moi je vais rajouter sudo, ce sera pas forcément le cas sur votre machine, c’est pour ça que je vous montre la commande sans sudo, et bon, moi je suis obligé de faire un sudo pour l’installer. Une fois que vous aurez donc cet outil, on va pouvoir démarrer. Comment vous allez démarrer ? On vous met dans la documentation ici qu’il suffira de faire un "vue init" et puis là, vous donnerez simplement le nom du template, alors les templates, vous les trouverez tous ici, et si vous voulez plus d’infos sur chaque template, il suffira d’aller directement voir ce qu’on a à l’intérieur du template et vous verrez qu’effectivement, on a le paquet qui est fourni, donc pour le webpack, on a vraiment une structure webpack qui est fournie qui permet de travailler avec du hot reload ici, avec pas mal de choses, des tests, etc., donc y’a beaucoup, beaucoup d’informations très intéressantes. Alors, une fois que vous aurez installé, vous verrez que vous aurez, voilà, un outil Vue qui vous permet de travailler et qui vous permet surtout de créer un projet. Alors comment ça va se passer si je veux créer un projet ? D’abord, malheureusement, la première des choses à faire se sera de supprimer tout ce que vous avez dans votre projet, ici, il faudra rien garder. Donc il faudra déplacer à la corbeille, hein, il faudra tout supprimer si vous voulez que ça fonctionne. Moi je vais supprimer, voilà, absolument tous les fichiers, heureusement on n’en a pas beaucoup ici et puis, je vais initier un projet avec la ligne de commande. Donc on va faire un "vue init" et je vais demander ici, pour le coup, un template webpack, alors webpack est un outil qui vous permet d’avoir des outils pour faire tourner le projet, pour compiler, etc., on en reparlera un petit peu après, "webpack" et "." et en faisant ça, on va vous demander si vous voulez que ça génère absolument tout. Bien oui, moi tiens, je veux absolument tout, donc OK. Il est en train de télécharger et puis, ensuite, il va m’installer le projet. Donc, comment s’appelle-t-il ? "vuejs" Vous pouvez faire entrer pour absolument tout, vous inquiétez pas, et puis, une fois que ce sera terminé, hop, il va vous mettre tout ce qu’il faut. Tout ce qu’il faut : c’est ça. Vous voyez que là, en utilisant la ligne de commande, on a généré une structure complète de projet. Bien c’est génial ! Avec l’outil en ligne de commande, vous générez une structure de projet. Elle est pas belle la vie !

Découvrir Vue.js 2

Animez et rendez réactive la vue d’une application web avec le framework Vue.js. Mettez en place les interfaces web de demain​ ​et utilisez les librairies externes de votre choix.

2h25 (44 vidéos)
Aucun commentaire n´est disponible actuellement
 
Logiciel :
Vue.js Vue.js 2.1
Spécial abonnés
Date de parution :14 févr. 2017

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !