Übersicht über Erweiterungsfunktionen

Visual Studio Code bietet zahlreiche Möglichkeiten für Erweiterungen, seine Funktionalität zu erweitern. Es kann manchmal schwierig sein, die richtigen Beitragspunkte und die VS Code API zu finden. Dieses Thema teilt die Erweiterungsfunktionen in einige Kategorien auf. Jede Kategorie beschreibt

• Einige Funktionalitäten, die Ihre Erweiterung nutzen könnte
• Links zu detaillierteren Themen zur Nutzung dieser Funktionalitäten
• Einige Erweiterungsideen

Wir legen jedoch auch Beschränkungen für Erweiterungen fest, um die Stabilität und Leistung von VS Code zu gewährleisten. Erweiterungen können beispielsweise nicht auf das DOM der VS Code-Benutzeroberfläche zugreifen.

Gemeinsame Funktionen

Allgemeine Funktionalitäten sind Kernfunktionalitäten, die Sie in jeder Erweiterung verwenden können.

Einige dieser Funktionalitäten umfassen

• Registrieren von Befehlen, Konfigurationen, Tastenkombinationen oder Kontextmenüeinträgen.
• Speichern von Arbeitsbereichs- oder globalen Daten.
• Anzeigen von Benachrichtigungsnachrichten.
• Verwenden von Quick Pick, um Benutzereingaben zu erfassen.
• Öffnen des Systemdateiauswahlfensters, damit Benutzer Dateien oder Ordner auswählen können.
• Verwenden der Progress API, um lang andauernde Vorgänge anzuzeigen.

Theming

Theming steuert das Aussehen von VS Code, sowohl die Farben des Quellcodes im Editor als auch die Farben der VS Code-Benutzeroberfläche. Wenn Sie jemals den Eindruck erwecken wollten, dass Sie im Matrix-Stil codieren, indem Sie VS Code in verschiedenen Grüntönen gestalten, oder einfach nur den ultimativen, minimalistischen Graustufen-Arbeitsbereich erstellen wollten, dann sind Themes für Sie.

Erweiterungsideen

• Ändern der Farben Ihres Quellcodes.
• Ändern der Farben der VS Code-Benutzeroberfläche.
• Portieren eines bestehenden TextMate-Themes nach VS Code.
• Hinzufügen benutzerdefinierter Dateisymbole.

Deklarative Sprachfeatures

Deklarative Sprachfeatures fügen grundlegende Textbearbeitungsunterstützung für eine Programmiersprache hinzu, wie z. B. Klammerabgleich, automatische Einrückung und Syntaxhervorhebung. Dies geschieht deklarativ, ohne Code zu schreiben. Für erweiterte Sprachfeatures wie IntelliSense oder Debugging siehe Programmatische Sprachfeatures.

Erweiterungsideen

• Bündeln gängiger JavaScript-Snippets in einer Erweiterung.
• Informieren Sie VS Code über eine neue Programmiersprache.
• Hinzufügen oder Ersetzen der Grammatik für eine Programmiersprache.
• Erweitern einer bestehenden Grammatik mit Grammaturinjektionen.
• Portieren einer bestehenden TextMate-Grammatik nach VS Code.

Programmatische Sprachfunktionen

Programmatische Sprachfeatures fügen reichhaltige Unterstützung für Programmiersprachen hinzu, wie z. B. Hovers, Gehe zu Definition, Diagnosefehler, IntelliSense und CodeLens. Diese Sprachfeatures werden über die vscode.languages.* API verfügbar gemacht. Eine Erweiterung kann diese APIs entweder direkt verwenden oder einen Language Server schreiben und ihn mithilfe der VS Code Language Server-Bibliothek an VS Code anpassen.

Obwohl wir eine Liste von Sprachfeatures und deren beabsichtigter Verwendung bereitstellen, hindert Sie nichts daran, diese APIs kreativ zu nutzen. CodeLens und Hovers sind beispielsweise eine großartige Möglichkeit, zusätzliche Informationen inline darzustellen, während Diagnosefehler verwendet werden können, um Rechtschreib- oder Code-Stilfehler hervorzuheben.

Erweiterungsideen

• Hinzufügen von Hovers, die Beispielverwendungen einer API anzeigen.
• Melden Sie Rechtschreib- oder Linter-Fehler im Quellcode mit Diagnosen.
• Registrieren Sie einen neuen Code-Formatter für HTML.
• Bieten Sie reichhaltige, kontextbezogene IntelliSense.
• Fügen Sie Faltungs-, Breadcrumb- und Gliederungsunterstützung für eine Sprache hinzu.

Workbench-Erweiterungen

Workbench-Erweiterungen erweitern die VS Code Workbench-Benutzeroberfläche. Fügen Sie dem Dateiexplorer neue Rechtsklickaktionen hinzu oder erstellen Sie sogar einen benutzerdefinierten Explorer mit der VS Code TreeView API. Und wenn Ihre Erweiterung eine vollständig angepasste Benutzeroberfläche benötigt, verwenden Sie die Webview API, um Ihre eigene Dokumentenvorschau oder Benutzeroberfläche mit Standard-HTML, CSS und JavaScript zu erstellen.

Erweiterungsideen

• Fügen Sie dem Dateiexplorer benutzerdefinierte Kontextmenüaktionen hinzu.
• Erstellen Sie eine neue, interaktive TreeView in der Seitenleiste.
• Definieren Sie eine neue Activity Bar-Ansicht.
• Zeigen Sie neue Informationen in der Statusleiste an.
• Rendern Sie benutzerdefinierten Inhalt mit der WebView API.
• Stellen Sie Quellcode-Management-Provider bereit.

Debugging

Sie können die Debugging-Funktionalität von VS Code nutzen, indem Sie Debugger-Erweiterungen schreiben, die die Debugging-Benutzeroberfläche von VS Code mit einem bestimmten Debugger oder einer Laufzeitumgebung verbinden.

Erweiterungsideen

• Verbinden Sie die Debugging-Benutzeroberfläche von VS Code mit einem Debugger oder einer Laufzeitumgebung, indem Sie eine Debug Adapter-Implementierung bereitstellen.
• Geben Sie die von einer Debugger-Erweiterung unterstützten Sprachen an.
• Bieten Sie reichhaltige IntelliSense- und Hover-Informationen für die vom Debugger verwendeten Debug-Konfigurationsattribute.
• Stellen Sie Debug-Konfigurations-Snippets bereit.

Auf der anderen Seite bietet VS Code auch eine Reihe von Debug Extension API, mit denen Sie Debugging-bezogene Funktionalitäten auf jeder VS Code-Debugger-Schicht implementieren können, um die Debugging-Erfahrung der Benutzer zu automatisieren.

Erweiterungsideen

• Starten Sie Debug-Sitzungen basierend auf dynamisch erstellten Debug-Konfigurationen.
• Verfolgen Sie den Lebenszyklus von Debug-Sitzungen.
• Erstellen und verwalten Sie Breakpoints programmatisch.

UX-Richtlinien

Damit sich Ihre Erweiterung nahtlos in die Benutzeroberfläche von VS Code einfügt, beachten Sie die UX-Richtlinien, wo Sie die bewährten Praktiken für die Erstellung von Erweiterungs-Benutzeroberflächen und Konventionen für die Einhaltung der bevorzugten VS Code-Workflows lernen.

Beschränkungen

Es gibt bestimmte Beschränkungen, die wir für Erweiterungen festlegen. Hier sind die Beschränkungen und ihre Zwecke.

Kein DOM-Zugriff

Erweiterungen haben keinen Zugriff auf das DOM der VS Code-Benutzeroberfläche. Sie können keine Erweiterung schreiben, die benutzerdefiniertes CSS auf VS Code anwendet oder ein HTML-Element zur VS Code-Benutzeroberfläche hinzufügt.

Bei VS Code versuchen wir kontinuierlich, die Nutzung der zugrunde liegenden Webtechnologien zu optimieren, um einen jederzeit verfügbaren, hochgradig reaktionsschnellen Editor bereitzustellen, und wir werden unsere DOM-Nutzung weiter abstimmen, während sich diese Technologien und unser Produkt weiterentwickeln. Um sicherzustellen, dass Erweiterungen die Stabilität und Leistung von VS Code nicht beeinträchtigen und wir das DOM von VS Code weiter verbessern können, ohne bestehende Erweiterungen zu brechen, führen wir Erweiterungen in einem Extension Host-Prozess aus und verhindern den direkten Zugriff auf das DOM.

Keine benutzerdefinierten Stylesheets

Ein benutzerdefiniertes Stylesheet, das von Benutzern oder Erweiterungen bereitgestellt wird, würde gegen die DOM-Struktur und Klassennamen verstoßen. Diese werden nicht dokumentiert, da wir sie als intern betrachten. Um VS Code weiterzuentwickeln, zu refaktorisieren oder zu verbessern, benötigen wir die Freiheit, Änderungen an der Benutzeroberfläche vorzunehmen. Jede Änderung am DOM kann bestehende benutzerdefinierte Stylesheets brechen, was zu Frustration für Stylesheet-Anbieter und einer schlechten Benutzererfahrung mit UI-Glitches aufgrund des fehlerhaften Stylesheets führt.

Stattdessen zielt VS Code darauf ab, eine gut gestaltete Erweiterungs-API anzubieten, die UI-Anpassungen unterstützt. Die API ist dokumentiert, wird mit Tools und Beispielen geliefert und bleibt über alle kommenden VS Code-Releases hinweg stabil.