Erste Schritte mit Visual Studio Code mit Windows-Subsystem für Linux

  • Artikel
  • 4 Minuten Lesedauer

Visual Studio Code ermöglicht Ihnen zusammen mit der WSL-Erweiterung die Verwendung von WSL als Vollzeitentwicklungsumgebung direkt aus VS Code. Ihre Möglichkeiten:

  • entwickeln in einer linuxbasierten Umgebung
  • Verwenden von Linux-spezifischen Toolketten und Dienstprogrammen
  • Ausführen und Debuggen Ihrer Linux-basierten Anwendungen vom Komfort von Windows aus, während der Zugriff auf Produktivitätstools wie Outlook und Office beibehalten wird
  • verwenden Sie das integrierte VS-Code-Terminal, um Ihre Linux-Verteilung auszuführen.
  • Nutzen von VS-Codefeatures wie IntelliSense-Codevervollständigen, Linting, Debugunterstützung, Codeausschnitte und Komponententests
  • Verwalten Sie ihre Versionsverwaltung ganz einfach mit der integrierten Git-Unterstützung von VS Code
  • Ausführen von Befehlen und VS-Codeerweiterungen direkt in Ihren WSL-Projekten
  • Bearbeiten von Dateien in Ihrem Linux- oder bereitgestellten Windows-Dateisystem (z. B. /mnt/c), ohne sich Gedanken über Pfadprobleme, binäre Kompatibilität oder andere herausforderungen mit dem Betriebssystem zu machen

Installieren von VS Code und der WSL-Erweiterung

  • Besuchen Sie die VS Code-Installationsseite , und wählen Sie das 32- oder 64-Bit-Installationsprogramm aus. Installieren Sie Visual Studio Code unter Windows (nicht im WSL-Dateisystem).

  • Wenn Sie aufgefordert werden, zusätzliche Aufgaben während der Installation auszuwählen, überprüfen Sie unbedingt die Option "Zu PFAD hinzufügen ", damit Sie einen Ordner in WSL ganz einfach mithilfe des Codebefehls öffnen können.

  • Installieren Sie das Erweiterungspaket für die Remoteentwicklung. Dieses Erweiterungspaket enthält die WSL-Erweiterung zusätzlich zu den Erweiterungen Remote - SSH und Dev Containers, mit denen Sie einen beliebigen Ordner in einem Container, auf einem Remotecomputer oder in WSL öffnen können.

Wichtig

Um die WSL-Erweiterung zu installieren, benötigen Sie die Version 1.35 Mai oder höher von VS Code. Es wird nicht empfohlen, WSL in VS Code ohne die WSL-Erweiterung zu verwenden, da Sie die Unterstützung für automatisches Abschließen, Debuggen, Linting usw. verlieren. Fun fact: Diese WSL-Erweiterung wird in $HOME/.vscode/extensions installiert (geben Sie den Befehl ls $HOME\.vscode\extensions\ in PowerShell ein).

Aktualisieren Der Linux-Verteilung

Einige WSL Linux-Distributionen fehlen Bibliotheken, die vom VS Code-Server zum Starten erforderlich sind. Sie können ihrer Linux-Verteilung zusätzliche Bibliotheken hinzufügen, indem Sie den Paket-Manager verwenden.

Verwenden Sie beispielsweise, um Debian oder Ubuntu zu aktualisieren:

sudo apt-get update

Um wget (zum Abrufen von Inhalten von Webservern) und Ca-Zertifikate (um SSL-basierte Anwendungen zu ermöglichen, die Echtheit von SSL-Verbindungen zu überprüfen), geben Sie Folgendes ein:

sudo apt-get install wget ca-certificates

Öffnen eines WSL-Projekts in Visual Studio Code

Über die Befehlszeile

Um ein Projekt aus der WSL-Verteilung zu öffnen, öffnen Sie die Befehlszeile der Verteilung, und geben Sie Folgendes ein: code .

Öffnen des WSL-Projekts mit VS Code-Remoteserver

Aus VS-Code

Sie können auch auf weitere VS-Code-WSL-Optionen zugreifen, indem Sie die Verknüpfung verwenden: CTRL+SHIFT+P in VS Code, um die Befehlspalette anzuzeigen. Wenn Sie dann eingeben WSL , wird eine Liste der verfügbaren Optionen angezeigt, sodass Sie den Ordner in einer WSL-Sitzung erneut öffnen können, geben Sie an, in welcher Verteilung Sie öffnen möchten, und vieles mehr.

Befehlspalette von VS Code

Erweiterungen innerhalb von VS Code WSL

Die WSL-Erweiterung teilt VS-Code in eine "Clientserver"-Architektur auf, wobei der Client (die Benutzeroberfläche) auf Ihrem Windows-Computer ausgeführt wird, und der Server (Ihr Code, Git, Plugins usw.) mit "remote" in Ihrer WSL-Verteilung ausgeführt wird.

Wenn Sie die WSL-Erweiterung ausführen, wird auf der Registerkarte "Erweiterungen" eine Liste der Erweiterungen angezeigt, die zwischen Ihrem lokalen Computer und ihrer WSL-Verteilung aufgeteilt sind.

Das Installieren einer lokalen Erweiterung, z. B. ein Design, muss nur einmal installiert werden.

Einige Erweiterungen, z. B. die Python-Erweiterung oder alles, was Dinge wie Linting oder Debugging behandelt, müssen separat in jeder WSL-Verteilung installiert werden. VS Code zeigt ein Warnsymbol ⚠zusammen mit einer grünen Schaltfläche "Installieren in WSL" an, wenn eine Erweiterung lokal installiert ist, die nicht in Ihrer WSL-Verteilung installiert ist.

VS-Code mit WSL-Erweiterungen und lokalen Erweiterungen

Weitere Informationen finden Sie in den VS Code-Dokumenten:

  • Wenn VS Code in WSL gestartet wird, werden keine Shellstartskripts ausgeführt. Weitere Informationen zum Ausführen zusätzlicher Befehle oder zum Ändern der Umgebung finden Sie in diesem Artikel zum Einrichten des Skripts für erweiterte Umgebungen .

  • Haben Sie Probleme beim Starten von VS Code über die WSL-Befehlszeile? Dieser Leitfaden zur Problembehandlung enthält Tipps zum Ändern von Pfadvariablen, beheben von Erweiterungsfehlern zu fehlenden Abhängigkeiten, Beheben von Problemen mit git-Line-Endproblemen, Installieren eines lokalen VSIX auf einem Remotecomputer, Starten eines Browserfensters, Blocker localhost-Port, Web-Sockets nicht funktioniert, Fehler beim Speichern von Erweiterungsdaten und vieles mehr.

Installieren von Git (optional)

Wenn du beabsichtigst, zusammen mit anderen zusammenzuarbeiten oder das Projekt an einem Open-Source-Standort (wie GitHub) zu hosten, unterstützt VS Code die Versionskontrolle mit Git. Auf der Registerkarte „Quellcodeverwaltung“ in VS Code werden alle Änderungen nachverfolgt und gängige Git-Befehle („Add“, „Commit“, „Push“, „Pull“) direkt in die Benutzeroberfläche integriert.

Informationen zum Installieren von Git finden Sie unter Einrichten von Git zum Arbeiten mit Windows-Subsystem für Linux.

Installieren von Windows-Terminal (optional)

Die neue Windows-Terminal ermöglicht mehrere Registerkarten (schnell zwischen Eingabeaufforderungen, PowerShell oder mehreren Linux-Distributionen), benutzerdefinierte Tastenbindungen (erstellen Sie eigene Tastenkombinationen zum Öffnen oder Schließen von Registerkarten, Kopieren+Einfügen usw.), Emojis und benutzerdefinierte Designs (Farbschemas ☺, Schriftarten und Größen, Hintergrundbild/Weichzeichner/Transparenz). Weitere Informationen finden Sie in der Windows Terminal-Dokumentation.

  1. Hole dir Windows-Terminal im Microsoft Store: Durch die Installation über den Store werden Updates automatisch durchgeführt.

  2. Öffne nach der Installation das Windows-Terminal, und wähle Einstellungen aus, um dein Terminal mithilfe der Datei profile.json anzupassen.

Weitere Ressourcen

Folgende zusätzliche Erweiterungen solltest du ebenfalls in Erwägung ziehen:

  • Tastaturlayouts anderer Editoren: Durch diese Erweiterungen wird die Arbeit in deiner Umgebung vereinfacht, wenn du von einem anderen Text-Editor umsteigst (z. B. Atom, Sublime, Vim, emacs, Notepad++ usw.).
  • Einstellungssynchronisierung: Damit kannst du die VS Code-Einstellungen in verschiedenen Installationen über GitHub synchronisieren. Wenn Sie auf verschiedenen Computern arbeiten, können Sie die Umgebung auf diese Weise konsistent halten.
  • Debugger für Chrome: Sobald Sie die Entwicklung auf der Serverseite mit Linux abgeschlossen haben, müssen Sie die Clientseite entwickeln und testen. Diese Erweiterung integriert deinen VS Code-Editor mit dem Debugdienst deines Chrome-Browsers, sodass du effizienter arbeiten kannst.