Geschichte über 33 Erweiterungen für VS Code, über deren Entwicklung und deren Verwaltung

Der Autor des Materials, dessen Übersetzung wir heute veröffentlichen, hat 33 Erweiterungen für VS Code erstellt. Er beschloss, mit denen, die diesen Editor mögen, Methoden zur Entwicklung und Unterstützung von Erweiterungen zu teilen. Außerdem sprach er kurz über seine Projekte. Vielleicht finden Sie unter ihnen etwas, das Ihnen nützlich ist.

So schreiben Sie Erweiterungen

Ich strebe nach produktiver Arbeit und liebe Automatisierung. Deshalb habe ich einen gut organisierten Prozess für die Entwicklung von Erweiterungen für VS Code entwickelt. Ich werde Ihnen die Hauptkomponenten dieses Prozesses erläutern.

OolsWerkzeuge

Ich habe ein sehr einfaches Tool geschrieben , mit dem Sie mithilfe einer Vorlage schnell mit neuen Projekten beginnen können. Das entsprechende Dienstprogramm funktioniert folgendermaßen:

• Es akzeptiert einen Ordner als Eingabe (dies wird als "Vorlage" bezeichnet).
• Es verarbeitet alle Dateien mithilfe des Lenkerpakets und stellt dabei Fragen, was für jeden gefundenen Platzhalter (wie {{name}} ) ersetzt werden soll.
• Als Ergebnis bildet sie einen neuen Ordner, dessen Dateien enthalten, was als Antwort auf ihre Fragen eingegeben wurde.

Ich habe darüber nachgedacht, das Dienstprogramm yeoman für die Arbeit mit Vorlagen zu verwenden, aber für meine Anforderungen scheint es unangemessen kompliziert zu sein. Ich habe das khaos- Tool verwendet, es wird jedoch nicht unterstützt und aktualisiert die Vorlagen nicht automatisch. Eine manuelle Aktualisierung bei Bedarf ist nicht besonders praktisch.

EmplVorlage

Auf diese Weise beginne ich mit der Template-Vscode-Erweiterung mit der Entwicklung einer neuen Erweiterung für VS Code.


Erstellen Sie ein neues Projekt

Nachdem die Antworten auf die Programmfragen eingegeben wurden, steht mir eine funktionierende Erweiterung zur Verfügung, so etwas wie "Hallo Welt!" für VS Code. Die Vorlage enthält viele Hilfsfunktionen, die ich, wie sich herausstellte, häufig bei der Entwicklung von Erweiterungen verwende. Insbesondere unterstützt die Vorlage das Laden der Benutzerkonfigurationsdatei aus dem Ordner .vscode , die automatische Registrierung von Befehlen, das Auffinden des aktuellen Stammverzeichnisses anhand der aktiven Datei und das Lösen anderer ähnlicher Probleme.

Wenn ich die Uhr zurückdrehen könnte, würde ich wahrscheinlich alle diese vscode-utils in einem eigenständigen Paket, so etwas wie vscode-utils , zusammenfassen, anstatt in jedem Erweiterungsentwicklungsprojekt Kopien dieser Funktionen zu vscode-utils . Aber dann wusste ich leider nicht, dass ich Dutzende von Erweiterungen erstellen würde. Jetzt muss ich einige Zeit damit verbringen, den entsprechenden Code in allen Projekten meiner Erweiterungen zu aktualisieren.

Wenn Sie vorhaben, Erweiterungen für VS Code zu entwickeln, würde ich Ihnen raten, eine eigene Vorlage zu erstellen, die möglicherweise auf meiner basiert.

▍Nützliche Dokumentation

Während des Entwicklungsprozesses habe ich immer die Dokumentation für den API VS Code zur Hand. Die Arbeit mit diesem Dokument, bei dem es sich um eine große Seite handelt, ist zunächst nicht besonders praktisch. Wenn Sie sich jedoch etwas Zeit nehmen, um es schnell zu überprüfen, und wenn Sie verstehen, welche APIs Ihnen zur Verfügung stehen, ist die Verwendung bequem. Im Allgemeinen kann ich feststellen, dass die verfügbaren APIs für mich in Ordnung sind.

Übrigens, wenn Sie Erweiterungen für VS Code entwickeln möchten, ist es äußerst nützlich, diesen Abschnitt der Dokumentation zu lesen.

▍Über Erweiterungen, die ich entwickelt habe

Ich entwickle Erweiterungen, um verschiedene Probleme zu lösen. Wir werden weiter unten darauf eingehen. Darüber hinaus helfen mir einige dieser Erweiterungen bei der Entwicklung anderer Erweiterungen.

Meine Erweiterungen

Wie gesagt, ich strebe nach Produktivität, daher zielen viele meiner Erweiterungen auf die Steigerung der Arbeitsproduktivität ab. Ich versuche, mich nicht mit der ständigen Erfindung des Fahrrads auseinanderzusetzen, sondern eine klare Trennung der Funktionen zwischen den verschiedenen Verlängerungen zu erreichen, damit ihre gemeinsame Nutzung keine Probleme verursacht.

Ich weiß nicht, ob dies gut oder schlecht ist, aber ich möchte Erweiterungen für VS Code erstellen. Darüber hinaus trocknet der Strom von Aufgaben, die automatisiert werden können, nicht aus. Deshalb habe ich, nachdem ich die erste Erweiterung geschrieben habe, die zweite und dann die dritte gemacht und bin damit auf die dreiunddreißigste gekommen.

Jetzt werde ich kurz über meine Erweiterungen sprechen. Details dazu finden Sie auf ihren Seiten.

▍ Erweiterungen zum Erstellen von Erweiterungen

Nr. 1. Debug-Manager

Mit der Erweiterung Debug Manager können Sie das Debuggen auch vom Terminal aus starten, ohne Aufgaben oder Konfigurationsdateien erstellen zu müssen. Ich habe diese Erweiterung erstellt, weil ich die Repositorys nicht mit unnötigen Dateien verstopfen wollte (und wer verwendet beispielsweise Aufgaben?). Ich glaube, dass das Starten des Debuggers vom Terminal aus eine so nützliche Funktion ist, dass er in VS Code selbst enthalten sein sollte.


Ausführen des Debuggers vom Terminal aus

Nr. 2. StatusBar-Debugger

Die StatusBar Debugger- Erweiterung fügt der Programmstatusleiste Debugging-Steuerelemente hinzu. Dies ist viel praktischer als das Standard-Debug- Panel . Wenn VS Code mehr Debugging-Daten liefern würde, wäre meine Erweiterung sogar noch besser.

Nummer 3. Installieren Sie .VSIX

Mit der Erweiterung .VSIX installieren können Sie .vsix Dateien direkt über das Bedienfeld installieren. Der Grund für diese Erweiterung war die Tatsache, dass das Standardinstallationsverfahren für solche Dateien unpraktisch ist .

Nummer 4. Beule

Mit der Bump- Erweiterung können Sie die Versionsnummer des Projekts erhöhen und neue Daten in das Änderungsprotokoll eingeben. Dieses Tool arbeitet nach seiner eigenen internen Logik, kann jedoch angepasst werden. Ich habe es erstellt, weil für jede anständige Erweiterung ein Änderungsprotokoll erforderlich ist. Dies bedeutet jedoch nicht, dass der Entwickler einer solchen Erweiterung das Journal manuell eingeben muss. Dies ist eine meiner Lieblingserweiterungen. Vielleicht werde ich ein darauf basierendes Befehlszeilentool erstellen, da ich möchte, dass es eines Tages die Automatisierung von GitHub-Releases ermöglicht.


Verwenden der Bump Extension

Nr. 5. Bilder optimieren

Mit der Erweiterung Bilder optimieren können Sie die im Projekt verfügbaren Bilder mithilfe einer vom Benutzer ausgewählten externen Anwendung optimieren. Ein Team - und die Arbeit ist erledigt.

▍ Projektmanagement

Nr. 6. Projekte +

Die Erweiterung Projekte + wird zum Verwalten von Projekten verwendet. Es verfügt über umfangreiche Funktionen, kann konfiguriert werden und findet automatisch Projekte. Eine der am häufigsten verwendeten Erweiterungen dieser Art ist Project Manager , aber ich habe ungefähr hundert Repositorys, und ich benötige die richtigen Tools, um sie zu verwalten. Eine davon ist die Unterstützung für unbegrenzte Verschachtelungsgruppen.


Arbeiten mit dem Projekt + Erweiterung

▍Verwaltungslisten verwalten

Nummer 7. Todo +

Die Todo + -Erweiterung vereinfacht das Arbeiten mit Aufgabenlisten. Es ist ein leistungsstarkes Tool, das einfach zu bedienen und anpassbar ist. Wenn Sie für TODO Dateien keine Syntaxhervorhebung benötigen oder mit der integrierten Standardhervorhebung zufrieden sind, können Sie die schöne Todo Tree- Erweiterung ausprobieren.


Syntaxhervorhebung mit Todo + und Informationen auf Projektebene

Nummer 8. Markieren

Die Highlight- Erweiterung ist ein erweitertes Tool zur Hervorhebung der Syntax regulärer Ausdrücke. Es ist nützlich für die Arbeit mit Aufgabenlisten, Anmerkungen und dergleichen. Die TODO Highlight- Erweiterung ist in diesem Bereich sehr beliebt, aber meine Erweiterung ist vielseitiger und viel leistungsfähiger. Außerdem funktioniert es wahrscheinlich schneller.

Nr. 9. Markdown todo

Die Markdown Todo- Erweiterung erleichtert das Arbeiten mit Aufgabenlisten in Markdown-Dateien. Es ist nichts Besonderes daran, aber es ermöglicht Ihnen, die Funktionen von Todo + in Markdown-Dateien zu nutzen.

Nr. 10. Projekte + Todo +

Mit der Erweiterung Projects + Todo + können Sie Projekte sozusagen aus der Vogelperspektive analysieren, um das Ergebnis der Aggregation aller Aufgaben-Dateien in einer Datei zu sehen. Wenn Sie die Erweiterung Projects + für das Projektmanagement und Todo + für die Arbeit mit Aufgabenlisten verwenden, können Sie dank dieser Erweiterung Aufgabenlisten von allen (oder von einigen) Projekten an einem Ort sammeln.

▍Erweiterungen zum Öffnen von Dateien

Das Wichtigste für mich ist die Möglichkeit, schnell zwischen verschiedenen Anwendungen oder Webseiten zu wechseln. Aus diesem Grund habe ich eine Reihe von Erweiterungen für VS Code erstellt, die die Lösung solcher Probleme vereinfachen.

Nr. 11. In der Anwendung öffnen

Mit der Erweiterung In Anwendung öffnen können Sie beliebige Dateien in der Standardanwendung oder in der Anwendung öffnen, die der Entwickler verwenden möchte. Dies ist eine universelle Erweiterung.

Nr. 12. In Browsern öffnen

Die Erweiterung In Browsern öffnen fügt dem Editor Befehle hinzu, mit denen Sie die aktuelle Datei oder das aktuelle Projekt in einem beliebigen Browser oder sogar sofort in allen verfügbaren Browsern öffnen können.

Nr. 13. Im Code öffnen

Die Open in Code- Erweiterung erleichtert das Wechseln zwischen VS Code und VS Code Insidern.

Nr. 14. Im Finder öffnen

Die Erweiterung In Finder öffnen dient zum Öffnen der aktuellen Datei oder des aktuellen Projekts im Finder-Dateimanager.

Nummer 15. In Github öffnen

Mit der Erweiterung In GitHub öffnen können Sie das aktuelle Projekt oder die aktuelle Datei auf github.com öffnen. Es gibt viele Erweiterungen, um dieses Problem zu lösen, aber als ich sie ausprobierte, stellte sich heraus, dass sie zu viele Funktionen haben, die ich nicht benötige.

Nr. 16. Im Gittower öffnen

Die Erweiterung In GitTower öffnen fügt dem Editor einen Befehl zum Öffnen des aktuellen Projekts in GitTower hinzu .

Nummer 17. Auf dem Marktplatz öffnen

Mit der Erweiterung In Marketplace öffnen wird der Editor mit einem Team ausgestattet, um das aktuelle Projekt im Erweiterungsverzeichnis für VS Code zu öffnen.

Nummer 18. Öffnen Sie in node_modules

Mit der Erweiterung In node_modules öffnen können Sie die Module finden, die dem ausgewählten Text oder einer beliebigen Zeile im Ordner node_modules und deren Ordner öffnen. Dies ist nützlich, wenn der Entwickler die von ihm verwendeten Module besser verstehen möchte.

Nr. 19. Geöffnet in npm

Mit der Erweiterung In NPM öffnen können Sie Modulseiten im Verzeichnis npm öffnen. Es ist praktisch, die Hilfeinformationen der Module anzuzeigen.

Nr. 20. Im Schiff öffnen

Die Erweiterung In Schiff öffnen fügt dem Editor einen Befehl zum Öffnen des aktuellen Projekts in Schiff hinzu. Leider hat Ship aufgehört zu arbeiten. Um die Informationen, die ich über Probleme in meinen Projekten erhalte, nicht zu vergessen, muss ich in Noty ein spezielles Erinnerungsblatt verwenden.

Nr. 21. Im Terminal öffnen

Die Erweiterung In Terminal öffnen erleichtert das Öffnen des aktuellen Projekts im Terminal.

Nummer 22. Beim Senden öffnen

Mit der Erweiterung Open in Transmit können Sie die aktuelle Datei oder das aktuelle Projekt in Transmit öffnen.

▍ Verschiedenes

Nummer 23. Browser aktualisieren

Mit der Erweiterung Browser Refresh können Sie die Seite im Browser aktualisieren, indem Sie fromR direkt in VS Code drücken, ohne zum Browser wechseln zu müssen. Diese Erweiterung ist nützlich, wenn die Option zum interaktiven Neuladen nicht verwendet werden kann und Sie keine browser-sync benötigen browser-sync um die Seite browser-sync aktualisieren, ohne dass dies erforderlich ist .

Nummer 24. Befehle

Mit der Erweiterung Befehle können Sie beliebige Befehle über die Statusleiste aufrufen. Argumentübergabe unterstützt.


Benutzerdefinierte Befehle Erstellt von Befehlen

Nummer 25. Diff

Mit der Diff- Erweiterung können Sie geöffnete Dateien vergleichen. Ich habe diese Erweiterung erstellt, weil das code-diff path1 path2 zu langsam ist.

Nr. 26. Git-Dateiversionsverlauf

Die Erweiterung " Git File History" vereinfacht die Analyse der Unterschiede zwischen der aktuellen Datei und der vorherigen Version. Es gibt viele Erweiterungen, um dieses Problem zu lösen, aber als ich sie ausprobierte, stellte sich heraus, dass sie entweder mit unnötigen Funktionen überfüllt oder nicht funktionsfähig waren.

Nummer 27. Github-Benachrichtigungen

Die sichere und anpassbare GitHub-Benachrichtigungserweiterung dient zum Anzeigen von GitHub-Benachrichtigungsinformationen in der Statusleiste.

Nr. 28. Monokai Nachtthema

Monokai Night Theme ist ein minimalistisches dunkles Thema, das auf dem Monokai-Thema basiert. Ich habe es erstellt, weil ich nicht herausfinden konnte, was mir aus bestehenden Themen passen würde.


Monokai Nachtthema

Nr. 29. Nein [Nicht unterstützt]

Die Erweiterung Nein [Nicht unterstützt] soll die Zeile "[Nicht unterstützt]" aus der Kopfzeile des Editors entfernen. Diese Erweiterung ist bereits veraltet, daher empfehle ich stattdessen Fix VSCode Checksums . Leider ist die nervige Inschrift „[Nicht unterstützt]“ auch nach dieser und dieser Diskussion nicht verschwunden.

Nr. 30. Öffnen Sie mehrere Dateien

Mit der Erweiterung Mehrere Dateien öffnen können Sie alle Dateien in einem bestimmten Ordner gleichzeitig öffnen. Bei Bedarf können Dateien nach Vorlage gefiltert werden.

Nr. 31. Suche - Alle Ergebnisse öffnen

Mit der Erweiterung Suchen - Alle Ergebnisse öffnen können Sie alle Suchergebnisse gleichzeitig mit einem einzigen Befehl anzeigen.

Nummer 32. Terminals Manager

Die Terminals Manager- Erweiterung automatisiert die Arbeit mit mehreren Terminals gleichzeitig, z. B. die Ausführung einiger darin enthaltener Befehle. Ich muss sagen, dass Terminals Manager meine erste Erweiterung war. Wenn Sie die Terminals verwenden, empfehle ich, es zu versuchen.

Nr. 33. Senden

Die Transmit- Erweiterung stattet den Editor mit mehreren Befehlen zum Organisieren der Interaktion mit Transmit aus.

Erweiterungsmanagement

Das Verwalten mehrerer Repositorys kann eine entmutigende Aufgabe sein. Ich werde Ihnen sagen, wie ich es mache.

▍ Wiederkehrende Commits

Früher oder später kommt der Moment, in dem Sie einige Änderungen an allen unterstützten Repositorys vornehmen müssen. Dies läuft darauf hinaus, dass viele Repositorys dieselben Commits ausführen müssen. Sehr bald wird es zu einer langweiligen Aufgabe.

Um die Lösung dieses Problems zu automatisieren, habe ich Autogit erstellt - ein Tool, mit dem Sie Befehle ausführen können, wenn sie auf viele Repositorys angewendet werden.


Ausführen eines Befehls mit Autogit

Ich finde ständig neue Möglichkeiten, autogit zu verwenden. Beispielsweise habe ich kürzlich mit diesem Tool die folgenden Änderungen in allen Repositorys vorgenommen, in denen der Code meiner Erweiterungen für VS-Code gespeichert ist:

• Mit webpack . Dies ergab eine Verbesserung der Startgeschwindigkeit von etwa 80%.
• Ignorieren package-lock.json . Diese Datei verstopft nur meinen Commit-Verlauf. Hier ist gutes Material zu diesem Thema.
• Aktualisieren Sie tsconfig.json . Ich benutze die neuen Funktionen der Sprache intensiv, insbesondere asynchrone Funktionen. Sie werden transponiert, wenn das Ziel der Transpilation auf <= es5 , auf sehr langsame Konstruktionen. Da VS Code modernen Code versteht, ist dies nicht mehr erforderlich.
• Deinstallieren Sie TSLint . Ich habe festgestellt, dass ich im Grunde genommen nicht auf die Spitzen des Linter achte, also habe ich diese Gelegenheit beseitigt.
• Verwendung eines hochauflösenden Logos in Referenzmaterialien. Früher habe ich das 128x128-Logo verwendet. Um das Aussehen der Referenzmaterialien zu verbessern, habe ich ein besseres Bild verwendet. Ich kann nicht sagen, dass das Bild selbst ein so gutes Wunder ist, aber das ist eine andere Geschichte.

Solche Änderungen in einem Repository vorzunehmen ist nicht lange, aber wenn es um dreiunddreißig geht, ist es viel schwieriger, ohne Automatisierungstools zu leben.

▍ Synchronisieren Sie Beschreibung und Schlüsselwörter mit GitHub

Was hier diskutiert wird, muss nicht getan werden, aber ein Tool, das die Synchronisation von Beschreibungen und Schlüsselwörtern automatisiert, würde mir nicht schaden. Diese Aufgabe kann von den Tools meiner Tools autogit und autogit-command-github-sync ausgeführt werden.


Synchronisieren Sie Beschreibungen und Schlüsselwörter mit Autogit

Aber Autogit-Command-Github-Publish ist mein Tool zum automatischen Erstellen neuer Repositorys.

▍Berichte

Kurz nachdem ich mehrere Erweiterungen erstellt hatte, interessierte ich mich dafür, wie beliebt sie sind und wie sich die Anzahl ihrer Downloads im Laufe der Zeit ändert. Informationen zu allen Erweiterungen eines bestimmten Entwicklers finden Sie auf einer speziellen Seite. Hier ist zum Beispiel meine Seite. Diese Seite enthält jedoch keine Informationen darüber, wie viele Erweiterungsdownloads seit der letzten Überprüfung durchgeführt wurden. Deshalb habe ich rssa erstellt . Dies ist ein Tool, mit dem Sie Änderungen an allen Elementen verfolgen können, auf die über die URL zugegriffen werden kann.


Von rssa empfangene Daten

Text ist gut, aber es wäre viel besser, die Daten in einem Diagramm darzustellen. Jetzt entwickle ich ein Tool, um dieses Problem zu lösen. Ich habe es noch nicht veröffentlicht. Hier sieht es beispielsweise wie der Download-Zeitplan für die Todo + -Erweiterung aus, der auf Daten rssa die mit rssa .


Todo + Download-Zeitplan

Hier können Sie an einigen Stellen einen starken Anstieg der Anzahl der Downloads feststellen. Dies geschieht, wenn Updates veröffentlicht werden, da die Installation von Erweiterungsupdates vom System als Download betrachtet wird. Dies führt dazu, dass jeder mit einer Million Downloads der Autor der Erweiterung sein kann, sie schreibt und viele Updates veröffentlicht. Dies ist übrigens eines der Probleme des Erweiterungskatalogs für VS Code.

Zusammenfassung

Einmal dachte ich, dass ich in Bezug auf die Anzahl der für VS Code veröffentlichten Erweiterungen nach Microsoft auf dem zweiten Platz lag. Wie sich jedoch herausstellte, haben einige von ihnen zwei mehr als meine. Deshalb schreibe ich weiterhin Erweiterungen.

Liebe Leser! Schreiben Sie Erweiterungen für VS Code?