Maison  >  Article  >  outils de développement  >  Quels sont les plug-ins couramment utilisés pour vscode ?

Quels sont les plug-ins couramment utilisés pour vscode ?

青灯夜游
青灯夜游original
2019-12-28 17:32:1210979parcourir

vscode (Visual Studio Code) est un éditeur de code léger et moderne, gratuit et open source, qui prend en charge la coloration syntaxique, la complétion intelligente du code, les raccourcis clavier personnalisés, la correspondance entre crochets et les extraits de code pour presque tous les langages de développement courants, la comparaison de code Diff, GIT. et d'autres fonctionnalités, prend en charge les extensions de plug-in et est optimisé pour le développement Web et le développement d'applications cloud.

Quels sont les plug-ins couramment utilisés pour vscode ?

Pour installer le plug-in vscode, il vous suffit de cliquer sur le bouton affiché dans l'image pour saisir l'extension, saisissez le nom du plug-in dans le champ Dans la zone de recherche, cliquez sur Installer et attendez la fin de l'installation. Cliquez sur Recharger pour redémarrer vscode afin que le plug-in prenne effet.

Lorsque vous n'avez pas besoin d'un certain plug-in, il vous suffit de saisir l'extension et de cliquer sur le bouton d'engrenage dans le coin inférieur droit du plug-in correspondant pour choisir de désactiver ou de désinstaller le plug-in. dans.

Quels sont les plug-ins couramment utilisés pour vscode ?

<.>Historique GitAfficher les journaux Git sous forme de graphiquesGitLens — Git suralimenté Afficher le dernier commit et l'auteur du fichier, et afficher les informations de commit de la ligne actuelle HTML BoilerplateEn utilisant le plug-in de modèle HTML, vous vous débarrassez du problème de réécriture des balises d'en-tête et de corps pour les nouveaux fichiers HTML. Il vous suffit de saisir du HTML dans le fichier vide et d'appuyer sur la touche Tab pour générer une structure de document propre HTMLHint HTML Détection du format de codeExtraits HTMLRemplissage automatique du codehtmltagwrapEnvelopper une couche de balises à l'extérieur de la balise HTML sélectionnéeAperçu de l'imageDéplacez la souris dans le chemin pour afficher l'aperçu de l'imageIndenticator Mettez en surbrillance la profondeur d'indentation actuelleintelliSense pour les noms de classe CSS en HTMLMettez le projet en CSS Le nom de l'invite intelligente dans le fichier est en html Extraits de code JavaScript (ES6)Extraits de code es6Live ServerActualisation du navigateur en temps réelLes modules Node .js Intellisense peuvent compléter automatiquement les modules JavaScript/TypeScript dans les instructions d'importationnpm Intellisense Invite de package lorsque cela est requisPath IntellisenseComplétion automatique du cheminQuokka.jsQuokka est un plug-in d'outil de débogage qui fournit des commentaires en temps réel basés sur le code que vous écrivez
Plugin Instructions Remarques
Balise de fermeture automatique Ajouter automatiquement une balise de fermeture HTML/XML
Balise de renommage automatique Renommer automatiquement les balises HTML/XML appariées
Embellir Code de format
Support Pair Colorizer Supports de correspondance d'identification des couleurs
Code Runner Un plug-in très puissant, capable de exécutez des extraits de code ou des fichiers de code dans plusieurs langages : C, C++, Java, JavaScript, PHP, Python, Perl, Ruby, Go, etc.
Une fois l'installation terminée, le coin supérieur droit apparaîtra : ▶
change-case Bien que VSCode dispose d'options de conversion de texte intégrées, il ne peut convertir que le texte en majuscules et en minuscules. cas. . Ce plug-in ajoute plus de formats de dénomination pour modifier le texte, y compris la dénomination en casse chameau, la dénomination séparée par le trait de soulignement, la dénomination Snake_case et la dénomination CONST_CAS, etc.
Pack de langue chinois (simplifié) pour Visual Studio Code Pack de langue chinois simplifié
Informations sur les couleurs Ce Un plugin pratique vous fournira des informations sur les couleurs que vous utilisez en CSS. Il vous suffit de passer le curseur sur la couleur pour prévisualiser les informations pertinentes du modèle de couleur (HEX, RVB, HSL et CMJN) dans le bloc de couleur
CSS Peek En utilisant ce plugin, vous pouvez tracer l'endroit où les classes et les identifiants CSS sont définis dans la feuille de style. Lorsque vous cliquez avec le bouton droit sur le sélecteur dans le fichier HTML et sélectionnez l'option "Aller à la définition et à la définition Peek", il vous enverra le code CSS pour le style
Débogueur pour Chrome Débogage frontal, Voir comment l'utiliser
ESLint EsLint peut nous aider à vérifier les erreurs de syntaxe dans la programmation Javascript. Par exemple : dans les applications Javascript, il est difficile de trouver les variables ou les méthodes que vous divulguez. EsLint peut nous aider à analyser le code JS, à trouver des bugs et à assurer un certain degré d'exactitude de l'écriture de la syntaxe JS
taille du fichier La taille actuelle du fichier est affichée dans la barre d'état en bas. Après avoir cliqué, vous pouvez également voir l'heure détaillée de création et de modification
"Alt + W" ("Option + W" pour Mac)

Utilisation : ctrl+shift+p Entrez quokka et sélectionnez un nouveau javascript
Regex Previewer Ceci est un outil pour Un outil utile pour tester les expressions régulières en temps réel. Il peut appliquer des modèles d'expression régulière à n'importe quel fichier ouvert et mettre en évidence toutes les correspondances
SVG Viewer Ce plug-in ajoute de nombreux éléments utiles Programmes SVG vers Visual Studio Code, vous permettant d'ouvrir des fichiers SVG et de les visualiser sans quitter l'éditeur. Dans le même temps, il comprend également des options de conversion au format PNG et de génération de modèles d'URI de données
Vetur Syntaxe Vue élevée Affichage des surbrillance, vérification des erreurs de syntaxe, complétion automatique du code
(Meilleur effet avec le plug-in ESLint)

vscode-fileheader Le modèle de commentaire supérieur peut définir l'auteur, l'heure et d'autres informations, et mettra automatiquement à jour l'heure de la dernière modification
Touche de raccourci : Ctrl+Alt+i
(Les informations par défaut peuvent être modifiées dans Fichier → Préférences → Paramètres)

Recommandations associées : Tutoriel d'introduction au 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:
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