Maison  >  Article  >  outils de développement  >  [Fortement recommandé] Le dernier résumé de l'extension VSCode !

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

藏色散人
藏色散人avant
2021-09-26 14:59:283257parcourir

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

[Fortement recommandé] Le dernier résumé de lextension VSCode !


bluloco-dark

[Fortement recommandé] Le dernier résumé de lextension VSCode !

bluloco-light


Thème Enki

[Fortement recommandé] Le dernier résumé de lextension VSCode !


eppz! (thème C# pour Unity)


Eva Theme


interface utilisateur plate

[Fortement recommandé] Le dernier résumé de lextension VSCode !

Thème GitHub

[Fortement recommandé] Le dernier résumé de lextension VSCode !

Monokai Pro


New Moon VSCode


One Dark Pro


Plastic


spacegray-vscode

[Fortement recommandé] Le dernier résumé de lextension VSCode !

Splus

[Fortement recommandé] Le dernier résumé de lextension VSCode !

三、个人首选项配置(仅供参考)

{  "breadcrumbs.enabled": true,  "editor.tabSize": 2,  "editor.renderWhitespace": "boundary",  "editor.cursorBlinking": "smooth",  "editor.minimap.renderCharacters": false,  "editor.fontFamily": "'Fira Code', 'Droid Sans Mono', 'Courier New', monospace, 'Droid Sans Fallback'",  "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('$eSEL', $SEL)"
  },  "prettier.tslintIntegration": true,  "cSpell.userWords": [    "Unmount"
  ],  "jest.autoEnable": false,
}

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:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer
Article précédent:Comment utiliser VSCode pour déboguer le code JS sur le navigateurArticle suivant:Comment utiliser VSCode pour déboguer le code JS sur le navigateur

Articles Liés

Voir plus