Maison  >  Article  >  interface Web  >  Comment créer un environnement de développement Vue avec vue-cli+webpack

Comment créer un environnement de développement Vue avec vue-cli+webpack

php中世界最好的语言
php中世界最好的语言original
2018-04-13 17:23:121926parcourir

Cette fois, je vais vous montrer comment créer un environnement de développement vue avec vue-cli+webpack Quelles sont les précautions pour créer un environnement de développement vue avec vue-cli+webpack. Voici des cas pratiques. Levez-vous et jetez un œil.

Ici, nous devons d'abord télécharger le nœud, car nous devons utiliser le téléchargement du package npm, qui est basé sur le nœud

Sans plus attendre, allons droit au but

Téléchargez le nœud, et vous devez télécharger git en même temps. À partir de maintenant, nous entrerons des commandes sur git pour construire notre environnement vue

. git utilise la commande linux

Ne demandez pas pourquoi, tant que ça marche, vous ne le pensez pas ?

Système Windows, après avoir téléchargé git, nous faisons un clic droit sur le bureau et vous verrez git Bash, cliquez dessus, puis ouvrez git,

Git a de nombreuses fonctions. En même temps, git peut transférer vos fichiers vers github. Github est un très bon outil de gestion d'entrepôt

. D'accord, commençons directement. Après avoir ouvert git,

sera affiché. Ensuite, nous exécutons npm inst<a href="http://www.php.cn/wiki/1483.html" target="_blank">all<code>npm inst<a href="http://www.php.cn/wiki/1483.html" target="_blank">all</a> webpack webpack

La dernière version du webpack sera automatiquement téléchargée

Ici, nous passons directement au sujet, comment utiliser vue-cli pour créer un environnement de développement vue

Ici, nous devons globalement installer vue-cli

Exécuter dans git npm install vue-cli -g Installer l'environnement de commande vue

Exécutez vue --verson pour vérifier si l'installation est réussie,

L'affichage de la version vue signifie que l'installation a réussi

Il s'agit d'une installation globale

Maintenant, nous entrons vue init webpack-simple<模板名,就是你的项目的名称>,

sur la ligne de commande Ici, nous utilisons webpack-simple pour le construire, car il n'a pas de spécifications strictes et est meilleur que la plupart des programmeurs. Je n'entrerai pas ici dans les détails de la différence entre celui-ci et webpack. Si nécessaire, vous pouvez laisser un message ci-dessous. partager avec vous

Ici mon nom de projet est myvue

Alors j'exécute vue init webpack-simple myvue

Il y aura un dossier myvue sur le bureau

Nous exécutons cd myvue et entrons dans notre projet

Vous trouverez ces fichiers sous le dossier. C'est l'environnement que vue-cli construit automatiquement pour nous

. Nous exécutons npm install

Pour le moment, nous devons attendre un moment, npm télécharge pour nous certains fichiers basés sur le nœud,

Ensuite, vous constaterez qu'il y a un autre nœud - le fichier module, qui contient certains modules du nœud

Ensuite on exécute depuis la ligne de commande npm run dev

vue a automatiquement ouvert le navigateur et exécuté le projet vue

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de PHP !

Lecture recommandée :

Comment implémenter la fonction de requête Ajax dans JS

Angular implémente des fonctions de filtrage et de suppression de table

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn