Entwickeln von VS Code-Erweiterungs-Plugins und Hello World

Erklärt die Schritte zum Einrichten der Umgebung für die Entwicklung von Erweiterungen (Plugins) im VS Code (Visual Studio Code) Texteditor und das Erstellen einer Hello World-App, die Benachrichtigungsnachrichten in JavaScript/TypeScript anzeigt.

Installieren Sie nodejs und die Abhängigkeit git mit choco in PowerShell mit Administratorrechten Starten Sie dann die Shell neu.

choco install git -y
choco install nodejs -y

Installieren Sie yo (yeoman) und generator-code von npm. Yeoman ist ein Tool, das Ordner, Dateien und gesamte Apps gemäß den Einstellungen generiert. generator-code ist wie eine Erweiterung für yeoman und wird automatisch mit yo verknüpft, wenn es installiert wird.

npm install -g yo generator-code

Führen Sie den Befehl “yo code” aus, um die App zu generieren. Setzen Sie bei der zweiten Eingabeaufforderung den App-Namen auf “HelloWorld”. Dies scheint ein vordefinierter Befehl zu sein, und wenn Sie diesen Namen ändern, wird die generierte App eine normale und Sie können kein Hello World machen, also seien Sie vorsichtig.

yo code # oder "yo" > "code"
// ? What type of extension do you want to create? New Extension (TypeScript)
// ? What's the name of your extension? HelloWorld

Öffnen Sie den App-Ordner in VS Code.

code ./helloworld

VS Code öffnet sich in einem neuen Fenster (code ./helloworld öffnet einfach den ./helloworld-Ordner in VS Code), führen Sie dort also die Debug-Ausführung mit F5 aus.

Dies öffnet ein weiteres neues Fenster. Dieses Fenster wird zum App-Fenster.

Öffnen Sie die Befehlspalette mit Strg+Shift+P in diesem Fenster, suchen Sie nach “Hello World” und führen Sie es aus. Dies führt diese Beispiel-App aus, die eine “Hello world”-Popup-Nachricht anzeigt.