Maison outils de développement VSCode Comment vscode construit un projet vue

Comment vscode construit un projet vue

Dec 16, 2019 pm 04:54 PM
vscode vue 搭建 项目

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
Copier après la connexion

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.

Comment vscode construit un projet vue

3. Installez webpack, qui est un outil pour empaqueter js

Commande d'installation :

npm install -g webpack
Copier après la connexion

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
Copier après la connexion

où myvue est le nom du projet, choisissez-le selon vos préférences.

Comment vscode construit un projet vue

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.

Comment vscode construit un projet vue

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.

Comment vscode construit un projet vue

5. Ensuite, exécutez le projet, d'abord cd dans le dossier du projet, cd myvue, puis entrez la commande suivante

npm run dev
Copier après la connexion

Comment vscode construit un projet vue

Après succès, saisissez :http://localhost:8080 dans le navigateur. Lorsque vous voyez l'écran suivant, c'est réussi.

Comment vscode construit un projet vue

6. Packaging du projet et mise en ligne

Entrez la commande :

npm run build
Copier après la connexion

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!

Déclaration de ce site Web
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

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Quelle configuration de l'ordinateur est requise pour VScode Quelle configuration de l'ordinateur est requise pour VScode Apr 15, 2025 pm 09:48 PM

Vs Code Système Exigences: Système d'exploitation: Windows 10 et supérieur, MacOS 10.12 et supérieur, processeur de distribution Linux: minimum 1,6 GHz, recommandé 2,0 GHz et au-dessus de la mémoire: minimum 512 Mo, recommandée 4 Go et plus d'espace de stockage: Minimum 250 Mo, recommandée 1 Go et plus d'autres exigences: connexion du réseau stable, xorg / wayland (Linux) recommandé et recommandée et plus

Frontend de Netflix: Exemples et applications de React (ou Vue) Frontend de Netflix: Exemples et applications de React (ou Vue) Apr 16, 2025 am 12:08 AM

Netflix utilise React comme cadre frontal. 1) Le modèle de développement composant de React et un écosystème fort sont les principales raisons pour lesquelles Netflix l'a choisi. 2) Grâce à la composante, Netflix divise les interfaces complexes en morceaux gérables tels que les lecteurs vidéo, les listes de recommandations et les commentaires des utilisateurs. 3) Le cycle de vie virtuel et composant virtuel de React optimise l'efficacité du rendu et la gestion de l'interaction des utilisateurs.

Comment résoudre le problème des annotations chinoises VScode deviennent des points d'interrogation Comment résoudre le problème des annotations chinoises VScode deviennent des points d'interrogation Apr 15, 2025 pm 11:36 PM

Comment résoudre le problème que les commentaires chinois dans le code Visual Studio deviennent des points d'interrogation: vérifiez le codage du fichier et assurez-vous qu'il s'agit de "UTF-8 sans bom". Changez la police en une police qui prend en charge les caractères chinois, tels que "Song Style" ou "Microsoft Yahei". Réinstallez la police. Activer le support Unicode. Mettre à niveau VScode, redémarrer l'ordinateur et recréer le fichier source.

Comment changer le mode chinois avec VScode Comment changer le mode chinois avec VScode Apr 15, 2025 pm 11:39 PM

VS Code pour changer le mode chinois: ouvrez l'interface des paramètres (Windows / Linux: Ctrl, macOS: CMD,) Recherchez des paramètres "Editor: Language" Sélectionnez "Chine

Commandes communes pour le terminal VScode Commandes communes pour le terminal VScode Apr 15, 2025 pm 10:06 PM

Les commandes communes pour les bornes de code vs incluent: effacer l'écran du terminal (Clear), répertorier le fichier de répertoire (LS) actuel, modifier le répertoire de travail actuel (CD), imprimer le répertoire de travail actuel (PWD), créer un nouveau répertoire (MKDIR), supprimer le répertoire vide (RMDIR), Créer un nouveau fichier (Touch) Supprimer un fichier ou répertoire (RM), copier un fichier ou directif) (mv) afficher le contenu du fichier (CAT) Affichage du contenu du fichier et défiler (moins) afficher le contenu du fichier Seule défilement (plus) Affichez les premières lignes du fichier (tête)

Comment définir VScode en chinois Comment définir VScode en chinois Apr 15, 2025 pm 09:27 PM

Il existe deux façons de configurer une langue chinoise dans Visual Studio Code: 1. Installez le package de langue chinoise; 2. Modifiez les paramètres "Locale" dans le fichier de configuration. Assurez-vous que la version du code Visual Studio est de 1,17 ou plus.

Comment définir VScode Comment définir VScode Apr 15, 2025 pm 10:45 PM

Pour activer et définir VScode, suivez ces étapes: installer et démarrer VScode. Préférences personnalisées, y compris les thèmes, les polices, les espaces et le formatage de code. Installez des extensions pour améliorer les fonctionnalités telles que les plugins, les thèmes et les outils. Créer un projet ou ouvrir un projet existant. Utilisez Intellisense pour obtenir des invites de code et des achèvements. Déboguez le code pour parcourir le code, définir des points d'arrêt et vérifier les variables. Connectez le système de contrôle de version pour gérer les modifications et commettre du code.

VSCODE Précédent la touche de raccourci suivante VSCODE Précédent la touche de raccourci suivante Apr 15, 2025 pm 10:51 PM

VS CODE Utilisation de la clé de raccourci en une étape / prochaine: une étape (arrière): Windows / Linux: Ctrl ←; macOS: cmd ← Étape suivante (vers l'avant): Windows / Linux: Ctrl →; macOS: CMD →

See all articles