Maison >outils de développement >VSCode >Comment vscode construit un projet vue
1. Installez Vscode, nodejs, etc.
2. Installer vue-cli globalement. vue-cli peut nous aider à créer rapidement des projets Vue.
Commande d'installation :
npm install -g vue-cli
Ouvrez le terminal VScode et affichez la zone de saisie de la commande. Cliquez sur Terminal-Nouveau terminal, entrez la commande ci-dessus, appuyez sur Entrée et attendez la fin de l'installation.
3. Installez webpack, qui est un outil pour empaqueter js
Commande d'installation :
npm install -g webpack
La méthode d'installation est la même que au-dessus de.
4. Une fois l'installation terminée, vous pouvez commencer à créer le projet vue. Créez d'abord un dossier pour stocker votre projet, ouvrez le dossier correspondant avec vscode et cd dans le dossier correspondant dans le terminal. Par exemple, mon dossier est myvue
Commande de création de projet, saisissez :
vue init webpack myvue
où myvue est le nom du projet, choisissez-le selon vos préférences.
Ensuite, certains éléments de configuration apparaîtront, qui peuvent être configurés selon les besoins, ou ils peuvent être définis par défaut et appuyer simplement sur Entrée.
Continuez ensuite à attendre que les dépendances soient installées. Une fois terminé, un projet vue de base sera construit. Une fois terminé, vous pouvez voir le répertoire suivant sur le côté gauche de vscode, dont main.js est l'entrée.
5. Ensuite, exécutez le projet, d'abord cd dans le dossier du projet, cd myvue, puis entrez la commande suivante
npm run dev
Après succès, saisissez :http://localhost:8080
dans le navigateur. Lorsque vous voyez l'écran suivant, c'est réussi.
6. Packaging du projet et mise en ligne
Entrez la commande :
npm run build
Une fois terminé, un dossier dist apparaîtra dans le projet. dossier , qui contient le contenu packagé et peut être déployé directement.
Articles et tutoriels connexes recommandés : tutoriel vscode
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!