[Fortement recommandé] Le dernier résumé de l'extension VSCode !

藏色散人

Libérer： 2021-09-26 15:00:46

avant

3285 Les gens l'ont consulté

L'article suivant vous présentera les extensions VSCode couramment utilisées. J'espère qu'il vous sera utile !

1. Expansion

Écrire des notes plus convivialesAjouter des signets de ligne Puis-je utiliserVérification de la compatibilité du navigateur pour HTML5, CSS3, SVG Vérificateur orthographique des motsouverture rapide de Bing et rechercher, vous pouvez configurer le moteur de rechercheLes valeurs de couleur sont mises en évidence dans le code Petite fenêtre Afficher les valeurs de couleur, RVB, HSL, CMJN, hexadécimal et plus encore DashDébogueur pour Chrome Document ThisDotENVModifier csvgitignore .gitignore la syntaxe du fichierGitLensAffiche les commits récents et les auteurs du fichier, affiche les informations de commit de la ligne actuelleGraphQL pour VS Code Point culminant du retraitConseils de saisie de classe CSSSyntaxe ES6 Extrait de code Style standard Prend en charge l'exécution d'un fichier de test unique ou d'un cas à usage uniqueOutil de reconstruction de code, fonctions d'extraction, renommage de variables, etc. jumpystylet-langueMoins d'IntelliSenseLodashLog WrapperTrier les lignes sélectionnéesTrier les importations de typescripttriage des importations de typescriptManipulation de chaîneTraitement de conversion de chaîne (cas de chameau, début majuscule, trait de soulignement, etc.) TODO AnalyseurTrieur d'importation TypeScriptExtraits de code Typescript React "Générateur de chaînes aléatoires" composants stylisés Extraits de code Vue2 api, vue-router2, vuex2)Plug-in de test en temps réel .log

2. Thème

Nom	Brève description
Fermeture automatique de la balise	Fermer automatiquement les balises HTML
Importation automatique	conseils d'importation
Tag de renommage automatique	Mod balises HTML de modification, modifiez automatiquement les balises correspondantes
Babel JavaScript	plugin babel, coloration syntaxique
Babelrc	.babelrc astuces pour la mise en évidence des fichiers
Embellir css/sass css/sass/ moins de formatage	De meilleurs commentaires
	Signets
	Lentille de support Astuce pour les parenthèses fermées Code en tête des parenthèses
Code Runner
Exécuter l'extrait de code sélectionné (prend en charge la plupart des langues)	Vérificateur orthographique du code
	CodeBing
	Color Highlight
	Color Info
Mise en évidence et transformations CSS-in-JS
Dash intégré
Déboguer Chrome
génération de documents d'annotation
.env mise en surbrillance du fichier
Modifier les fichiers CSV	"EditorConfig pour VS Code" code
endy	Sauter le curseur de saisie à la fin de la ligne actuelle
Error Gutters	Code d'erreur rapide au numéro de ligne
ES Lint	Plug-in ESLint, conseils de surbrillance
File Peek	Localisez rapidement le fichier en fonction de la chaîne de chemin
fichier taille	Statut affichage de la barre Taille actuelle du fichier
Find-Jump	Sauter rapidement à la position du mot spécifiée
Codes de police géniaux pour html	FontAwesome Astuce Code segment
ftp-sync	synchroniser les fichiers avec ftp
Git Blame	Affichez les informations Git de la ligne actuelle dans le barre d'état
Historique des fichiers Git	Parcourez rapidement l'historique des modifications de validation de fichier unique
Git Graph	Vue graphique Git, navigation pratique et exploiter
Git History (git log)	Afficher le journal Git

	Points forts et conseils de graphql
extrait de Gulp	Mettre en surbrillance la balise correspondante
Mettre en surbrillance les balises sélectionnées correspondantes	Achèvement de la classe CSS HTML
Conseils de classe CSS	Prise en charge HTML CSS
astuce CSS (support vue)	HTMLHint
astuce de formatage HTML	htmltagwrap
Enveloppez rapidement les balises html	htmltagwrap
Incluant HTML	Import Beautify
importation de regroupement, de tri, de formatage "Coût d'importation"
	IntelliSense pour les noms de classe CSS
	Extraits de code JavaScript (ES6)
	Norme JavaScript Style
	Jest Runner
	JS Refactor
Formater et compresser JSON
Sauter rapidement à la position du mot spécifié
Mise en évidence et astuces de la syntaxe du stylet
moins de variables et de conseils de mixage
Extrait de code Lodash
	Code de production pour l'impression des variables sélectionnées S nippets
Moka snippets	Résoudre les modules Node
Naviguez rapidement vers les modules Node	npm
Exécuter les commandes npm	npm Intellisense
Lors de l'importation d'un module, le nom du module installé est demandé.	Comparez deux morceaux de code ou fichier Conseils pour compléter le chemin
Path Intellisense	Une autre astuce pour terminer le chemin
Polacode	générer du code en images
Tri PostCss	Tri CSS
Prettier - Formateur de code	plus joli plug-in officiel
Prettify JSON	Format JSON
Gestionnaire de projet	Changer rapidement de projet
Quokka.js	Pas besoin d'exécuter manuellement, les résultats variables sont affichés en ligne
Rainbow CSV	Le fichier CSV utilise les couleurs de l'arc-en-ciel pour restituer différentes colonnes
Réagissez aux livres d'histoires autochtones	plug-in d'aperçu de livre d'histoires, prend en charge React
React Playground	fournit un environnement d'exécution de composant React pour l'éditeur afin de faciliter le débogage
Réagissez Extraits de code de style standard	bloc de code de style standard React
Client REST	Envoyer une requête HTTP de style REST
Sass	Plugin Sass


stylelint	css/sass/less code style
SVG Viewer	SV G Viewer
Synchronisation	Paramètres vscode synchronisés avec Gist
Test Spec Generator	Génération de cas de test (prend en charge le chai, devrait,
"Gestion de Todo" le Citations	switch Citations JS dans " -> ' -> `
Achèvement du postfix TS/JS	invite de suffixe ts/js
TSLint TypeScript Hero	Plug-in auxiliaire TypeScript, gestion de l'importation, du contour, etc.
tri des importations
React Typescript snippet
TypeSearch	TS déclaration fichier search
Version Lens Le fichier	package.json montre que le module est actuellement version et dernière version Plug-in Vue, prend en charge Vue3
"Afficher le package de nœuds" s	VS Live Share
Assistance multijoueur en temps réel	VSCode Great Icons
Extension d'icône de fichier	vscode-base de données
faire fonctionner la base de données, prendre en charge mysql et postgres	vscode-icons
icônes de fichiers pour faciliter la localisation des fichiers	vscode-aléatoire
mise en évidence des composants stylisés soutien
vscode-styled-jsx	styled-jsx mettant en évidence le support
Vue Peek	Prise en charge du passage au fichier de définition de composant Vue
	Wallaby.js
	Wrap Console Log Lite

Nom	Aperçu
Thème Atom One Light
bluloco-dark
bluloco-light
Thème Enki
eppz! (thème C# pour Unity)
Eva Theme
interface utilisateur plate
Thème GitHub
Monokai Pro
New Moon VSCode
One Dark Pro
Plastic
spacegray-vscode
Splus

三、个人首选项配置（仅供参考）

{  "breadcrumbs.enabled": true,  "editor.tabSize": 2,  "editor.renderWhitespace": "boundary",  "editor.cursorBlinking": "smooth",  "editor.minimap.renderCharacters": false,  "editor.fontFamily": "&#39;Fira Code&#39;, &#39;Droid Sans Mono&#39;, &#39;Courier New&#39;, monospace, &#39;Droid Sans Fallback&#39;",  "editor.fontLigatures": true,  "explorer.confirmDragAndDrop": false,  "extensions.autoUpdate": false,  "files.insertFinalNewline": true,  "git.autofetch": true,  "git.path": "F:\\Program Files\\Git\\cmd\\git.exe",  "search.exclude": {    "**/node_modules": true,    "**/dist": true
  },  "typescript.locale": "en",  "window.titleBarStyle": "custom",  "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}",  "window.zoomLevel": 1,  "workbench.activityBar.visible": true,  "workbench.colorTheme": "Plastic - deprioritised punctuation",  "workbench.iconTheme": "vscode-great-icons",  "workbench.startupEditor": "newUntitledFile",  "eslint.autoFixOnSave": true,  "eslint.validate": ["javascript", "javascriptreact", "vue"],  "vsicons.projectDetection.autoReload": true,  "vsicons.dontShowNewVersionMessage": true,  "tslint.autoFixOnSave": true,  "debugwrapper.wrappers": {    "default": "console.log(&#39;$eSEL&#39;, $SEL)"
  },  "prettier.tslintIntegration": true,  "cSpell.userWords": [    "Unmount"
  ],  "jest.autoEnable": false,
}

Copier après la connexion