Arbeiten mit GitHub in VS Code

GitHub ist ein cloudbasierter Dienst zum Speichern und Teilen von Quellcode. Die Verwendung von GitHub mit Visual Studio Code ermöglicht es Ihnen, Ihren Quellcode direkt in Ihrem Editor zu teilen und mit anderen zusammenzuarbeiten. Es gibt viele Möglichkeiten, mit GitHub zu interagieren, zum Beispiel über die Website unter https://github.com oder die Git-Befehlszeilenschnittstelle (CLI). In VS Code wird die umfassende GitHub-Integration jedoch durch die Erweiterung GitHub Pull Requests and Issues bereitgestellt.

In diesem Thema zeigen wir Ihnen, wie Sie einige Ihrer bevorzugten GitHub-Funktionen nutzen können, ohne VS Code zu verlassen.

Voraussetzungen

Um mit GitHub in VS Code zu starten, benötigen Sie:

• Git ist auf Ihrem Computer installiert. Installieren Sie Git Version 2.0.0 oder höher auf Ihrem Rechner.

• Ein GitHub-Konto.

• Die in VS Code installierte Erweiterung GitHub Pull Requests and Issues.

• Wenn Sie Änderungen committen, verwendet Git Ihren konfigurierten Benutzernamen und Ihre E-Mail-Adresse. Sie können diese Werte wie folgt festlegen:

  git config --global user.name "Your Name"
  git config --global user.email "your.email@example.com"
  

Erste Schritte mit GitHub Pull Requests und Issues

Sobald Sie die Erweiterung GitHub Pull Requests and Issues installiert haben, müssen Sie sich anmelden.

1. Wählen Sie das GitHub-Symbol in der Aktivitätsleiste aus.

2. Wählen Sie Anmelden (Sign In) und folgen Sie den Anweisungen, um sich im Browser bei GitHub zu authentifizieren.

   

3. Sie sollten zurück zu VS Code weitergeleitet werden.

Falls Sie nicht zu VS Code weitergeleitet werden, können Sie Ihr Autorisierungstoken manuell hinzufügen.

1. Kopieren Sie Ihr Autorisierungstoken im Browserfenster.
2. Wählen Sie in VS Code Anmeldung bei github.com... in der Statusleiste aus.
3. Fügen Sie das Token ein und drücken Sie Eingabe, um den Anmeldevorgang abzuschließen.

Einrichten eines Repositorys

Ein Repository klonen

Sie können ein Repository von GitHub suchen und klonen, indem Sie den Befehl Git: Clone in der Befehlspalette verwenden (⇧⌘P (Windows, Linux Strg+Umschalt+P)) oder die Schaltfläche Repository klonen in der Quellcodeverwaltungsansicht verwenden (verfügbar, wenn kein Ordner geöffnet ist).

Im Dropdown-Menü für GitHub-Repositorys können Sie das Repository filtern und auswählen, das Sie lokal klonen möchten.

Erfahren Sie mehr über das Klonen von Repositorys und die Arbeit mit Remotes.

Authentifizierung mit einem bestehenden Repository

Die Aktivierung der Authentifizierung über GitHub erfolgt automatisch, wenn Sie in VS Code eine Git-Aktion ausführen, die eine GitHub-Authentifizierung erfordert, wie etwa das Pushen in ein Repository, dessen Mitglied Sie sind, oder das Klonen eines privaten Repositorys. Sie müssen keine speziellen Erweiterungen für die Authentifizierung installieren; sie ist in VS Code integriert, damit Sie Ihr Repository effizient verwalten können.

Wenn Sie eine Aktion ausführen, die eine GitHub-Authentifizierung erfordert, fordert VS Code Sie zur Anmeldung auf. Folgen Sie den Schritten, um sich bei GitHub anzumelden und zu VS Code zurückzukehren.

Die Anmeldung mit einem persönlichen Zugriffstoken (PAT) wird nur mit GitHub Enterprise Server unterstützt. Wenn Sie GitHub Enterprise Server verwenden und ein PAT nutzen möchten, können Sie bei den Anmeldeaufforderungen auf Abbrechen klicken, bis Sie zur Eingabe eines PAT aufgefordert werden.

Beachten Sie, dass es verschiedene Möglichkeiten gibt, sich bei GitHub zu authentifizieren, einschließlich der Verwendung Ihres Benutzernamens und Passworts mit Zwei-Faktor-Authentifizierung (2FA), einem persönlichen Zugriffstoken oder einem SSH-Schlüssel. Weitere Informationen und Details zu den einzelnen Optionen finden Sie unter About authentication to GitHub.

Editor-Integration

Hover-Infos

Wenn Sie ein Repository geöffnet haben und ein Benutzer mit @-Zeichen erwähnt wird (z. B. in einem Code-Kommentar), können Sie den Mauszeiger über diesen Benutzernamen bewegen, um ein GitHub-ähnliches Popup mit den Details des Benutzers zu sehen.

Ein ähnliches Popup gibt es für mit #-Zeichen erwähnte Issue-Nummern, vollständige GitHub-Issue-URLs und in Repositorys spezifizierte Issues.

Vorschläge

Benutzervorschläge werden durch die Eingabe des "@"-Zeichens ausgelöst, und Issue-Vorschläge werden durch die Eingabe des "#"-Zeichens ausgelöst. Vorschläge sind im Editor und im Eingabefeld für Commit-Nachrichten der Quellcodeverwaltung verfügbar.

Die Issues, die in den Vorschlägen erscheinen, können mit der Einstellung GitHub Issues: Queries ( githubIssues.queries In VS Code öffnen In VS Code Insiders öffnen ) konfiguriert werden. Die Abfragen verwenden die GitHub-Suchsyntax.

Sie können auch konfigurieren, für welche Dateitypen diese Vorschläge angezeigt werden sollen, indem Sie die Einstellungen GitHub Issues: Ignore Completion Trigger ( githubIssues.ignoreCompletionTrigger In VS Code öffnen In VS Code Insiders öffnen ) und GitHub Issues: Ignore User Completion Trigger ( githubIssues.ignoreUserCompletionTrigger In VS Code öffnen In VS Code Insiders öffnen ) verwenden. Diese Einstellungen akzeptieren ein Array von Sprachkennungen, um die Dateitypen festzulegen.

// Languages that the '#' character should not be used to trigger issue completion suggestions.
"githubIssues.ignoreCompletionTrigger": [
  "python"
]

Pull-Anfragen

In der Ansicht Pull Requests können Sie Pull Requests anzeigen, verwalten und erstellen.

Die Abfragen, die zum Anzeigen von Pull Requests verwendet werden, können mit der Einstellung GitHub Pull Requests: Queries ( githubPullRequests.queries In VS Code öffnen In VS Code Insiders öffnen ) konfiguriert werden und verwenden die GitHub-Suchsyntax.

"githubPullRequests.queries": [
    {
        "label": "Assigned To Me",
        "query": "is:open assignee:${user}"
    },

Pull Requests erstellen

Sobald Sie Änderungen in Ihren Fork oder Branch committet haben, können Sie den Befehl GitHub Pull Requests: Create Pull Request oder die Schaltfläche Create Pull Request in der Ansicht Pull Requests verwenden, um einen Pull Request zu erstellen.

Eine neue Ansicht Create wird angezeigt, in der Sie das Basis-Repository und den Basis-Branch auswählen können, auf die sich Ihr Pull Request beziehen soll, sowie Titel und Beschreibung ausfüllen können. Wenn Ihr Repository eine Pull-Request-Vorlage besitzt, wird diese automatisch für die Beschreibung verwendet.

Verwenden Sie die Schaltflächen in der Aktionsleiste oben, um Zuweisungen (Assignees), Reviewer, Labels und einen Milestone hinzuzufügen.

Das Menü der Schaltfläche Create erlaubt es Ihnen, alternative Erstellungsoptionen auszuwählen, wie z. B. Create Draft (Entwurf erstellen) oder eine Auto-Merge-Methode zu aktivieren.

Wenn Sie Create auswählen und Ihren Branch noch nicht zu einem GitHub-Remote gepusht haben, wird die Erweiterung fragen, ob Sie den Branch veröffentlichen möchten, und ein Dropdown-Menü zur Auswahl des spezifischen Remotes bereitstellen.

Die Ansicht Create Pull Request wechselt nun in den Review Mode, in dem Sie die Details des PR überprüfen, Kommentare hinzufügen und den PR mergen können, sobald er bereit ist. Nachdem der PR gemergt wurde, haben Sie die Option, sowohl den Remote- als auch den lokalen Branch zu löschen.

Reviewing

Pull Requests können über die Ansicht Pull Requests überprüft werden. Sie können Reviewer und Labels zuweisen, Kommentare hinzufügen, genehmigen, schließen und alles direkt aus der Beschreibung (Description) des Pull Requests mergen.

Auf der Seite Beschreibung können Sie den Pull Request auch ganz einfach lokal mit der Schaltfläche Checkout auschecken. Dadurch wird VS Code in den Review-Modus geschaltet, um den Fork und den Branch des Pull Requests zu öffnen (sichtbar in der Statusleiste), und eine neue Ansicht Changes in Pull Request hinzugefügt. Von dort aus können Sie Diffs der aktuellen Änderungen sowie alle Commits und die Änderungen innerhalb dieser Commits einsehen. Dateien, die kommentiert wurden, sind mit einem Rauten-Symbol gekennzeichnet. Um die Datei auf der Festplatte zu sehen, können Sie die Inline-Aktion Open File verwenden.

Die Diff-Editoren aus dieser Ansicht verwenden die lokale Datei, sodass Dateinavigation, IntelliSense und Bearbeitung wie gewohnt funktionieren. Sie können innerhalb des Editors Kommentare zu diesen Diffs hinzufügen. Sowohl das Hinzufügen einzelner Kommentare als auch das Erstellen eines vollständigen Reviews wird unterstützt.

Wenn Sie mit der Überprüfung der Änderungen des Pull Requests fertig sind, können Sie den PR mergen oder Exit Review Mode auswählen, um zu dem vorherigen Branch zurückzukehren, an dem Sie gearbeitet haben.

Issues

Issues erstellen

Issues können über die +-Schaltfläche in der Ansicht Issues oder über die Befehle GitHub Issues: Create Issue from Selection und GitHub Issues: Create Issue from Clipboard erstellt werden. Sie können auch über eine Code-Aktion für "TODO"-Kommentare erstellt werden. Beim Erstellen von Issues können Sie die Standardbeschreibung übernehmen oder auf das Bleistift-Symbol Edit Description in der oberen rechten Ecke klicken, um einen Editor für den Inhalt des Issues aufzurufen.

Sie können den Trigger für die Code-Aktion über die Einstellung GitHub Issues: Create Issue Triggers ( githubIssues.createIssueTriggers In VS Code öffnen In VS Code Insiders öffnen ) konfigurieren.

Die Standard-Issue-Trigger sind:

"githubIssues.createIssueTriggers": [
  "TODO",
  "todo",
  "BUG",
  "FIXME",
  "ISSUE",
  "HACK"
]

An Issues arbeiten

In der Ansicht Issues können Sie Ihre Issues sehen und an ihnen arbeiten.

Standardmäßig wird ein Branch für Sie erstellt, wenn Sie mit der Arbeit an einem Issue beginnen (Kontextmenüpunkt Start Working on Issue), wie in der Statusleiste im Bild unten gezeigt.

Die Statusleiste zeigt auch das aktive Issue an. Wenn Sie dieses Element auswählen, steht eine Liste von Issue-Aktionen zur Verfügung, wie z. B. das Öffnen des Issues auf der GitHub-Website oder das Erstellen eines Pull Requests.

Sie können den Namen des Branchs mithilfe der Einstellung GitHub Issues: Issue Branch Title ( githubIssues.issueBranchTitle In VS Code öffnen In VS Code Insiders öffnen ) konfigurieren. Wenn Ihr Workflow keine Branch-Erstellung vorsieht oder Sie jedes Mal zur Eingabe eines Branch-Namens aufgefordert werden möchten, können Sie diesen Schritt überspringen, indem Sie die Einstellung GitHub Issues: Use Branch For Issues ( githubIssues.useBranchForIssues In VS Code öffnen In VS Code Insiders öffnen ) deaktivieren.

Sobald Sie mit der Arbeit am Issue fertig sind und eine Änderung committen möchten, wird das Eingabefeld für die Commit-Nachricht in der Ansicht Quellcodeverwaltung mit einer Nachricht vorausgefüllt, die mit GitHub Issues: Working Issue Format SCM ( githubIssues.workingIssueFormatScm In VS Code öffnen In VS Code Insiders öffnen ) konfiguriert werden kann.

GitHub Repositories Erweiterung

Mit der Erweiterung GitHub Repositories können Sie schnell in jedem Remote-GitHub-Repository browsen, suchen, bearbeiten und committen, direkt aus Visual Studio Code heraus, ohne das Repository lokal klonen zu müssen. Dies kann in vielen Szenarien schnell und bequem sein, in denen Sie nur Quellcode überprüfen oder eine kleine Änderung an einer Datei oder einem Asset vornehmen müssen.

Ein Repository öffnen

Sobald Sie die GitHub Repositories-Erweiterung installiert haben, können Sie ein Repository mit dem Befehl GitHub Repositories: Open Repository... aus der Befehlspalette (⇧⌘P (Windows, Linux Strg+Umschalt+P)) oder durch Klicken auf die Remote-Anzeige unten links in der Statusleiste öffnen.

Wenn Sie den Befehl Open Repository ausführen, wählen Sie aus, ob Sie ein Repository von GitHub öffnen, einen Pull Request von GitHub öffnen oder ein Repository erneut öffnen möchten, mit dem Sie zuvor verbunden waren.

Wenn Sie sich zuvor noch nicht von VS Code aus bei GitHub angemeldet haben, werden Sie aufgefordert, sich mit Ihrem GitHub-Konto zu authentifizieren.

Sie können die Repository-URL direkt angeben oder GitHub nach dem gewünschten Repository durchsuchen, indem Sie den Namen in das Textfeld eingeben.

Sobald Sie ein Repository oder einen Pull Request ausgewählt haben, wird das VS Code-Fenster neu geladen und Sie sehen den Inhalt des Repositorys im Datei-Explorer. Sie können dann Dateien öffnen (mit vollständigem Syntax-Highlighting und Klammer-Matching), Änderungen vornehmen und committen, genau wie bei der Arbeit an einem lokalen Klon eines Repositorys.

Ein Unterschied zur Arbeit mit einem lokalen Repository besteht darin, dass Änderungen beim Committen mit der GitHub Repository-Erweiterung direkt in das Remote-Repository gepusht werden, ähnlich wie bei der Arbeit in der GitHub-Weboberfläche.

Ein weiteres Feature der GitHub Repositories-Erweiterung ist, dass Sie jedes Mal, wenn Sie ein Repository oder einen Branch öffnen, die aktuellen Quellen von GitHub erhalten. Sie müssen nicht daran denken, ein „Pull“ durchzuführen, um die Daten zu aktualisieren, wie es bei einem lokalen Repository der Fall wäre.

Die GitHub Repositories-Erweiterung unterstützt das Anzeigen und sogar Committen von LFS-getrackten Dateien, ohne dass Git LFS (Large File System) lokal installiert werden muss. Fügen Sie die Dateitypen, die mit LFS getrackt werden sollen, einer .gitattributes-Datei hinzu und committen Sie Ihre Änderungen dann direkt über die Ansicht „Quellcodeverwaltung“ zu GitHub.

Branches wechseln

Sie können einfach zwischen Branches wechseln, indem Sie auf die Branch-Anzeige in der Statusleiste klicken. Ein großartiges Feature der GitHub Repositories-Erweiterung ist, dass Sie Branches wechseln können, ohne uncommittete Änderungen zwischenspeichern (stashing) zu müssen. Die Erweiterung merkt sich Ihre Änderungen und wendet sie wieder an, wenn Sie den Branch wechseln.

Remote Explorer

Mit dem Remote Explorer, der in der Aktivitätsleiste verfügbar ist, können Sie schnell Remote-Repositorys erneut öffnen. Diese Ansicht zeigt Ihnen die zuvor geöffneten Repositorys und Branches an.

Pull Requests erstellen

Wenn Ihr Workflow Pull Requests anstelle von direkten Commits in ein Repository verwendet, können Sie einen neuen PR aus der Ansicht „Quellcodeverwaltung“ erstellen. Sie werden aufgefordert, einen Titel anzugeben und einen neuen Branch zu erstellen.

Sobald Sie einen Pull Request erstellt haben, können Sie die Erweiterung GitHub Pull Request and Issues verwenden, um Ihren PR zu überprüfen, zu bearbeiten und zu mergen, wie früher in diesem Thema beschrieben.

Virtuelles Dateisystem

Da die Dateien des Repositorys nicht auf Ihrem lokalen Rechner liegen, erstellt die GitHub Repositories-Erweiterung ein virtuelles Dateisystem im Arbeitsspeicher, damit Sie Dateiinhalte anzeigen und bearbeiten können. Die Verwendung eines virtuellen Dateisystems bedeutet, dass einige Vorgänge und Erweiterungen, die lokale Dateien voraussetzen, nicht aktiviert sind oder eine eingeschränkte Funktionalität aufweisen. Features wie Tasks, Debugging und integrierte Terminals sind nicht aktiviert. Über den Link Features sind nicht verfügbar (features are not available) beim Überfahren der Remote-Anzeige mit der Maus erfahren Sie mehr über den Grad der Unterstützung für das virtuelle Dateisystem.

Erweiterungsautoren können im Virtual Workspaces extension author's guide mehr über das Ausführen in einem virtuellen Dateisystem und Arbeitsbereich erfahren.

Weiterarbeiten an

Manchmal möchten Sie zu einer Entwicklungsumgebung wechseln, die ein lokales Dateisystem sowie volle Sprach- und Entwicklungswerkzeuge unterstützt. Die GitHub Repositories-Erweiterung macht es Ihnen leicht:

• Einen GitHub Codespace erstellen (wenn Sie die Erweiterung GitHub Codespaces installiert haben).
• Das Repository lokal klonen.
• Das Repository in einen Docker-Container klonen (wenn Docker und die Microsoft Container Tools-Erweiterung installiert sind).

Um die Entwicklungsumgebung zu wechseln, verwenden Sie den Befehl Weiterarbeiten an... (Continue Working On), der über die Befehlspalette (⇧⌘P (Windows, Linux Strg+Umschalt+P)) oder durch Klicken auf die Remote-Anzeige in der Statusleiste verfügbar ist.

Wenn Sie den browserbasierten Editor verwenden, bietet der Befehl "Weiterarbeiten an" Optionen, um das Repository lokal oder in einer Cloud-gehosteten Umgebung in GitHub Codespaces zu öffnen.

Wenn Sie Weiterarbeiten an zum ersten Mal mit uncommitteten Änderungen verwenden, haben Sie die Möglichkeit, Ihre Bearbeitungen mit Cloud-Änderungen (Cloud Changes) in Ihre gewählte Entwicklungsumgebung zu übertragen. Dies speichert Ihre ausstehenden Änderungen auf demselben VS Code-Dienst, der auch für die Synchronisierung der Einstellungen verwendet wird.

Diese Änderungen werden von unserem Dienst gelöscht, sobald sie auf Ihre Ziel-Entwicklungsumgebung angewendet wurden. Wenn Sie sich entscheiden, ohne Ihre uncommitteten Änderungen weiterzuarbeiten, können Sie diese Einstellung jederzeit später ändern, indem Sie die Einstellung "workbench.cloudChanges.continueOn": "prompt" konfigurieren.

Falls Ihre ausstehenden Änderungen nicht automatisch auf Ihre Ziel-Entwicklungsumgebung angewendet werden, können Sie Ihre gespeicherten Änderungen mit dem Befehl Cloud-Änderungen: Cloud-Änderungen anzeigen (Cloud Changes: Show Cloud Changes) einsehen, verwalten und löschen.

Nächste Schritte

• Erfahren Sie mehr über KI in VS Code – Hier erfahren Sie mehr über KI-Funktionen in VS Code.