[Sehr empfehlenswert] Die neueste Zusammenfassung der VSCode-Erweiterung!

Der folgende Artikel stellt Ihnen häufig verwendete VSCode-Erweiterungen vor. Ich hoffe, er wird Ihnen hilfreich sein!

1. Erweiterung

Tag automatisch schließenHTML-Tags automatisch schließen Automatischer ImportImporttippsAutomatisches Umbenennen HTML-Tags ändern, passende Tags automatisch ändernBabel JavaScriptBabel-Plugin, SyntaxhervorhebungBabelrc.babelrc-DateihervorhebungstippsCSS/Sass CSS/Sass/ verschönern Weniger Formatierung. Bracket-Objektiv CSS-in-JS-Hervorhebung und TransformationenIntegrierter DashChrome debuggen Erstellung von Anmerkungsdokumenten.env-Dateihervorhebung CSV-Dateien bearbeitenFile PeekSuchen Sie schnell die Datei anhand des Pfads. stringDatei GrößeStatus Balkenanzeige Aktuelle Dateigröße ftp-syncGit BlameGit-DateiverlaufGit GraphGit-Verlauf (Git-Protokoll)HTML-CSS-UnterstützungHTMLHinthtmltagwraphtmltagwrapBeautify importieren?? EinzugshervorhebungAusgabe-Kolorierer.Farbige Ausgabeinformationen.Teilweise. Diff ParameterhinweisePfad. AutovervollständigungPath IntellisensePolacodePostCss-SortierungPrettier – Codeformatierer„React Typescript Snippet“ Die Datei vscode-random? Unterstützt das Springen zur Vue-KomponentendefinitionsdateiWallaby.jsWrap Console Log Lite

Name:

Bessere Kommentare

Tipp bei geschlossenen Klammern. Code am Kopf der Klammern

Kann ich verwenden

Browserkompatibilitätsprüfung für HTML5, CSS3, SVG

Codeübersicht

Codestrukturbaum anzeigen

Code Runner

Ausgewähltes Code-Snippet ausführen (unterstützt die meisten Sprachen)

Code-Rechtschreibprüfung

Wort-Rechtschreibprüfung

. CodeBing

Fast Open Bing und suchen, können Sie die Suchmaschine konfigurieren

Farbhervorhebung

Farbwerte werden im Code hervorgehoben

Farbinfo

Kleines Fenster zur Anzeige von Farbwerten, RGB, HSL, CMYK, Hex und mehr. Farbauswahl. Farbauswahl. CSS-in-JS

Dash

Debugger für Chrome

Dokumentieren Sie dies

DotENV

CSV bearbeiten

EditorConfig für VS Code

EditorConfig Plugin

Emoji

Eingeben ji im Code

endy

Springen Sie mit dem Eingabecursor an das Ende der aktuellen Zeile ES Lint

ESLint-Plug-in, Highlight-Tipps

FontAwesome Tipp-Code-Segment

Dateien mit FTP synchronisieren

Zeigen Sie die Git-Informationen der aktuellen Zeile im an Statusleiste

Durchsuchen Sie schnell den Verlauf einzelner Datei-Commit-Änderungen

Git-Grafikansicht, praktisches Durchsuchen und betreiben

Sehen Sie sich das Git-Protokoll an

Git Tree Compare

Git Tree-Vergleich, um die Unterschiede zwischen verschiedenen Zweigen zu sehen

. gitignore

Syntax der .gitignore-Datei QL für VSCode

graphql-Highlights und Tipps

Anleitungen

Highlight-Einrückungsrichtlinien

Gulp Snippets

Gulp-Ausschnitt

Markieren Sie passende Tags. Markieren Sie passende ausgewählte Tags. Markieren Sie passende Tags

CSS-Hinweise (Vue unterstützt)

HTML-Format-Tipps

HTML-Tags schnell umschließen

Einschließlich HTML

Gruppierung, Sortierung, Formatierung importieren

IntelliSense für CSS-Klassennamen. Tipps zur Eingabe von CSS-Klassen Haustier

JavaScript-Standard Stil: Standardstil: Jest Runner: Jest Runner

JS Refactor

Code-Rekonstruktionstool, Extrahierungsfunktionen, Umbenennen von Variablen usw

Formatieren und komprimieren Sie JSON.

jumpy

Schnell zur angegebenen Wortposition springen

Hervorhebung der Stiftsyntax und Tipps

Weniger IntelliSense

weniger Variablen und Mixin-Tipps

Lodash

Lodash-Code-Snippet

Log Wrapper

Produktionscode zum Drucken ausgewählter Variablen

Markdownlint

Markdown-Format. Tipps

Mokka S-Schnipsel

Mokka-Schnipsel

Knotenmodule auflösen

Navigieren Sie schnell zu Knotenmodulen

npm

Führen Sie npm-Befehle aus

npm Intellisense

Beim Importieren eines Moduls wird der Name des installierten Moduls angezeigt.

Vergleichen Sie zwei Codeteile oder Datei

Parameternamen beim Funktionsaufruf angeben

Tipps zur Pfadvervollständigung

Ein weiterer Tipp zur Pfadvervollständigung

Code in Bilder generieren

CSS-Sortierung

Prettier offizielles Plug-in

JSON verschönern

JSON formatieren

Projektmanager

Projekte schnell wechseln

Quokka.js

Eine manuelle Ausführung ist nicht erforderlich, variable Ergebnisse werden inline angezeigt Reagieren Sie auf einheimische Bilderbücher

Storybook-Vorschau-Plug-in, unterstützt React

React Playground

bietet eine Reaktionskomponenten-Laufumgebung für den Editor, um das Debuggen zu erleichtern

Reagieren Codeausschnitte im Standardstil

Codeblock im Standardstil reagieren

REST-Client

HTTP-Anfrage im REST-Stil senden

Sass

Sass-Plugin

Einstellungen synchronisieren

VSCode-Einstellungen mit Gist synchronisiert

Sortierlinien

Ausgewählte Zeilen sortieren

Typoskript-Importe sortieren

Typoskript-Importsortierung

String-Manipulation

String-Konvertierungsverarbeitung (Kamelbuchstaben, Großbuchstaben, Unterstrich usw.)

stylelint

CSS/Sass/weniger Code-Stil

SVG Viewer

SV G Viewer

Synchronisierung

vscode-Einstellungen mit Gist synchronisiert

Testspezifikationsgenerator

Testfallgenerierung (unterstützt Chai, Should, Jasmine)

TODO-Parser

Todo-Verwaltung

Todo-Todo-Baum

Sammeln Sie TODO-Kommentare im Code und unterstützen Sie schnell Zitate umschalten JS-Anführungszeichen in " -> ' -> `

TS/JS-Postfix-Vervollständigung

ts/js-Suffix-Eingabeaufforderung

T SLint

TypeScript Hero: TypeScript-Hilfs-Plug-in, Import, Gliederung usw. verwalten

TypeScript-Importsortierer

Sortierung importieren

Typescript React-Codeschnipsel

package.json zeigt, dass das Modul ist derzeit Version und neueste Version

vetur

Vue. Plugin

Volar

Vue-Plug-in, unterstützt Vue3

Knotenpaket anzeigen

Öffnen Sie schnell die Startseite und das Code-Repository des ausgewählten Moduls

Visual Studio IntelliCode

AI-basierter Code Aufforderungen

VS Live Share

Echtzeit-Multiplayer-Unterstützung

VSCode Great Icons

Dateisymbol. Erweiterung

vscode-Datenbank

Betreiben Sie die Datenbank, unterstützen Sie MySQL und Postgres

Zufälliger String-Generator gestylte Komponenten

Hervorhebung gestylter Komponenten Unterstützung

„Vue TypeScript Snippets“ s (einschließlich Vue2 API, Vue-Router2, Vuex2)

Echtzeit-Test-Plug-in

.log

2. Thema

Atom One Light Theme

Enki-ThemaGitHub Theme

bluloco-dark
bluloco-light
eppz (C#-Theme für Unity)
Eva-Theme	Flache Benutzeroberfläche
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": "'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,
}

Das obige ist der detaillierte Inhalt von[Sehr empfehlenswert] Die neueste Zusammenfassung der VSCode-Erweiterung!. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!