VS Code での GitHub の利用
GitHub は、ソースコードを保存および共有するためのクラウドベースのサービスです。VS Code で GitHub を使用すると、エディター内で直接ソースコードを共有し、他のユーザーと共同作業を行うことができます。GitHub と連携する方法は多数あります(例: Web サイト https://github.com や Git コマンドラインインターフェイス(CLI)経由など)。しかし、VS Code においては、GitHub Pull Requests and Issues 拡張機能によって、リッチな GitHub 統合が提供されます。
本トピックでは、VS Code を離れることなく、GitHub の主要な機能を活用する方法を解説します。
ソース管理が初めての方や、VS Code の基本的な Git サポートについて詳しく知りたい場合は、まずソース管理のトピックをご覧ください。
前提条件
VS Code で GitHub を使い始めるには、以下が必要です。
-
コンピューターに Git がインストールされていること。Git バージョン 2.0.0 以降をインストールしてください。
-
VS Code に GitHub Pull Requests and Issues 拡張機能がインストールされていること。
-
変更をコミットする際、Git は設定されたユーザー名とメールアドレスを使用します。これらは以下のコマンドで設定できます。
git config --global user.name "Your Name" git config --global user.email "your.email@example.com"
GitHub Pull Requests and Issues 入門
GitHub Pull Requests and Issues 拡張機能をインストールしたら、サインインする必要があります。
-
アクティビティバーの GitHub アイコンを選択します。
-
サインイン (Sign In) を選択し、プロンプトに従ってブラウザで GitHub の認証を行います。

-
自動的に VS Code にリダイレクトされます。
VS Code にリダイレクトされない場合は、認証トークンを手動で追加できます。
- ブラウザウィンドウで、認証トークンをコピーします。
- VS Code で、ステータスバーにある Signing in to github.com... を選択します。
- トークンを貼り付けて Enter キーを押し、サインインプロセスを完了します。
リポジトリのセットアップ
リポジトリのクローン
コマンドパレット (⇧⌘P (Windows, Linux Ctrl+Shift+P)) から Git: Clone コマンドを使用するか、ソース管理ビューの リポジトリのクローン (Clone Repository) ボタン(フォルダーを開いていないときに表示されます)を使用して、GitHub からリポジトリを検索してクローンできます。
GitHub リポジトリのドロップダウンから、ローカルにクローンしたいリポジトリをフィルタリングして選択できます。

リポジトリのクローンとリモートでの作業の詳細をご覧ください。
既存リポジトリでの認証
GitHub 経由の認証は、所属するリポジトリへのプッシュやプライベートリポジトリのクローンなど、GitHub 認証が必要な Git 操作を VS Code で実行する際に有効になります。認証のために特別な拡張機能をインストールする必要はありません。VS Code に組み込まれているため、効率的にリポジトリを管理できます。
GitHub 認証が必要な操作を実行すると、VS Code がサインインを促します。手順に従って GitHub にサインインし、VS Code に戻ってください。

個人アクセストークン (PAT) によるサインインは、GitHub Enterprise Server でのみサポートされています。GitHub Enterprise Server を使用しており、PAT を利用したい場合は、PAT の入力を求められるまでサインインプロンプトで キャンセル (Cancel) を選択してください。
GitHub への認証には、ユーザー名とパスワード(2要素認証/2FA)、個人アクセストークン、SSH キーの使用など、複数の方法があります。各オプションの詳細については、GitHub への認証についてを参照してください。
内容をローカルマシンにクローンせずにリポジトリで作業したい場合は、GitHub Repositories 拡張機能をインストールして、GitHub 上のファイルを直接閲覧・編集できます。GitHub Repositories 拡張機能の詳細をご覧ください。
エディター統合
ホバー
リポジトリを開いているときにユーザーが @メンション(コードコメント内など)されると、そのユーザー名にマウスを重ねることで、GitHub スタイルの詳細情報が表示されます。

#-メンションされた Issue 番号、GitHub Issue の完全な URL、およびリポジトリ指定の Issue についても同様のホバー表示があります。

候補の表示 (Suggestions)
ユーザーの候補は「@」を入力すると、Issue の候補は「#」を入力するとトリガーされます。候補はエディターおよびソース管理のコミットメッセージ入力ボックスで利用可能です。

候補に表示される Issue は、GitHub Issues: Queries ( githubIssues.queries ) 設定で構成できます。クエリには GitHub 検索構文を使用します。
また、どのファイルタイプでこれらの候補を表示するかは、GitHub Issues: Ignore Completion Trigger ( githubIssues.ignoreCompletionTrigger ) および GitHub Issues: Ignore User Completion Trigger ( githubIssues.ignoreUserCompletionTrigger ) 設定を使用して構成できます。これらの設定には、ファイルタイプを指定するために言語識別子の配列を指定します。
// Languages that the '#' character should not be used to trigger issue completion suggestions.
"githubIssues.ignoreCompletionTrigger": [
"python"
]
プルリクエスト
Pull Requests ビューから、プルリクエストを表示、管理、作成できます。

プルリクエストを表示するためのクエリは、GitHub Pull Requests: Queries ( githubPullRequests.queries ) 設定で構成でき、GitHub 検索構文を使用します。
"githubPullRequests.queries": [
{
"label": "Assigned To Me",
"query": "is:open assignee:${user}"
},
プルリクエストの作成
フォークまたはブランチに変更をコミットしたら、GitHub Pull Requests: Create Pull Request コマンド、または Pull Requests ビューの Create Pull Request ボタンを使用してプルリクエストを作成できます。

新しい 作成 (Create) ビューが表示され、プルリクエストのターゲットとするベースリポジトリとベースブランチを選択し、タイトルと説明を入力できます。リポジトリにプルリクエストテンプレートがある場合、説明欄に自動的に適用されます。
上部のアクションバーにあるボタンを使用して、担当者 (Assignees)、レビュー担当者 (Reviewers)、ラベル (Labels)、マイルストーン (Milestone) を追加できます。

作成 (Create) ボタンのメニューからは、ドラフトとして作成 (Create Draft) や 自動マージ (Auto-Merge) 有効化など、その他の作成オプションを選択できます。
作成 (Create) を選択した際、まだブランチを GitHub リモートにプッシュしていない場合は、拡張機能がブランチを公開するかどうかを確認し、特定のリモートを選択するドロップダウンを表示します。
Create Pull Request ビューは レビューモード (Review Mode) に切り替わります。ここで PR の詳細を確認し、コメントを追加し、準備ができたら PR をマージできます。PR がマージされると、リモートブランチとローカルブランチの両方を削除するオプションが表示されます。
AI を使用して、PR に含まれるコミットに基づいた PR タイトルと説明を生成します。PR タイトルフィールドの横にあるきらめき (sparkle) アイコンを選択すると、生成が実行されます。

レビュー
プルリクエストは Pull Requests ビューからレビューできます。レビュー担当者やラベルの割り当て、コメントの追加、承認、クローズ、マージをすべてプルリクエストの 説明 (Description) から実行可能です。

説明 (Description) ページからは、Checkout ボタンを使用してプルリクエストを簡単にローカルへチェックアウトできます。これにより、VS Code はプルリクエストのフォークとブランチをレビューモードで開き(ステータスバーで確認可能)、新しい Changes in Pull Request ビューが追加されます。このビューから、現在の変更の差分に加え、すべてのコミットとそのコミット内での変更を確認できます。コメントされたファイルにはダイヤモンド型のアイコンが表示されます。ファイルをディスク上で表示するには、インラインの ファイルを開く (Open File) アクションを使用します。

このビューの差分エディターはローカルファイルを使用するため、ファイルナビゲーション、IntelliSense、編集は通常通り動作します。これらの差分に対してエディター内でコメントを追加できます。単一のコメントの追加およびレビュー全体を作成する機能の両方がサポートされています。
プルリクエストの変更のレビューが完了したら、PR をマージするか、レビューモードを終了 (Exit Review Mode) を選択して、作業していた以前のブランチに戻ることができます。
また、PR を作成する前に、AI を使用してコードレビューを実行することも可能です。GitHub Pull Request ビューにある Code Review ボタンを選択してください。
Issue (課題管理)
Issue の作成
Issue は、Issues ビューの + ボタン、または GitHub Issues: Create Issue from Selection および GitHub Issues: Create Issue from Clipboard コマンドを使用して作成できます。「TODO」コメントに対するコードアクションを使用して作成することも可能です。Issue を作成する際、デフォルトの説明を使用するか、右上の鉛筆アイコン Edit Description を選択して Issue 本文用のエディターを呼び出すことができます。

コードアクションのトリガーは、GitHub Issues: Create Issue Triggers ( githubIssues.createIssueTriggers ) 設定を使用して構成できます。
デフォルトの Issue トリガーは以下の通りです。
"githubIssues.createIssueTriggers": [
"TODO",
"todo",
"BUG",
"FIXME",
"ISSUE",
"HACK"
]
Issue の対応
Issues ビューから、自分の Issue を確認し、それらに対する作業を開始できます。

デフォルトでは、Issue に対する作業を開始(コンテキストメニューの Start Working on Issue)すると、下の画像にあるステータスバーに示されるように、自動的にブランチが作成されます。

ステータスバーには現在のアクティブな Issue も表示されます。その項目を選択すると、GitHub Web サイトで Issue を開く、またはプルリクエストを作成するといった Issue 関連のアクション一覧が利用可能です。

ブランチ名は GitHub Issues: Issue Branch Title ( githubIssues.issueBranchTitle ) 設定で構成できます。ワークフローでブランチの作成を行わない場合、または毎回ブランチ名の入力を求めたい場合は、GitHub Issues: Use Branch For Issues ( githubIssues.useBranchForIssues ) 設定をオフにすることで、その手順をスキップできます。
ブランチの管理、切り替え、開発作業の整理については、ブランチでの作業の詳細をご覧ください。
Issue での作業が完了して変更をコミットしたい場合、ソース管理 (Source Control) ビューのコミットメッセージ入力ボックスにメッセージが自動入力されます。これは GitHub Issues: Working Issue Format SCM ( githubIssues.workingIssueFormatScm ) で構成できます。
GitHub Repositories 拡張機能
GitHub Repositories 拡張機能を使用すると、リポジトリをローカルにクローンすることなく、リモートの GitHub リポジトリを直接 Visual Studio Code 内で素早く閲覧、検索、編集、コミットできます。これは、ソースコードのレビューやファイル、アセットへの小さな変更だけを行いたいといった多くのシナリオにおいて、迅速で便利です。

リポジトリを開く
GitHub Repositories 拡張機能をインストールしたら、コマンドパレット (⇧⌘P (Windows, Linux Ctrl+Shift+P)) から GitHub Repositories: Open Repository... コマンドを使用するか、ステータスバー左下のリモートインジケーターをクリックしてリポジトリを開くことができます。

Open Repository コマンドを実行すると、GitHub からリポジトリを開くか、GitHub からプルリクエストを開くか、以前接続したリポジトリを再度開くかを選択できます。
以前に VS Code から GitHub にログインしていない場合は、GitHub アカウントでの認証を求められます。

テキストボックスに直接リポジトリの URL を入力するか、GitHub 内を検索して目的のリポジトリを選択できます。
リポジトリまたはプルリクエストを選択すると VS Code ウィンドウがリロードされ、ファイルエクスプローラーにリポジトリの内容が表示されます。その後は、リポジトリをローカルにクローンして作業する場合と同じように、ファイルを開いて(フルシンタックスハイライトと括弧マッチング付き)、編集し、変更をコミットできます。
ローカルリポジトリでの作業との違いの一つは、GitHub Repository 拡張機能で変更をコミットすると、GitHub Web インターフェイスで作業している場合と同様に、変更がリモートリポジトリに直接プッシュされる点です。
GitHub Repositories 拡張機能のもう一つの特徴は、リポジトリやブランチを開くたびに、GitHub から最新のソースが取得されることです。ローカルリポジトリのように、更新のために手動でプルする必要はありません。
GitHub Repositories 拡張機能は、Git LFS (Large File System) をローカルにインストールしなくても、LFS で追跡されているファイルの表示やコミットをサポートしています。LFS で追跡したいファイルタイプを .gitattributes ファイルに追加し、ソース管理ビューを使用して GitHub に直接変更をコミットしてください。
ブランチの切り替え
ステータスバーのブランチインジケーターをクリックすることで、ブランチ間を簡単に切り替えられます。GitHub Repositories 拡張機能の優れた機能の一つは、コミットされていない変更をスタッシュ(退避)することなくブランチを切り替えられる点です。拡張機能が変更を記憶し、ブランチを切り替えた際に自動的に再適用します。

Remote Explorer
アクティビティバーにある Remote Explorer を使用して、リモートリポジトリを素早く再開できます。このビューには、過去に開いたリポジトリとブランチが表示されます。

プルリクエストの作成
リポジトリへの直接コミットではなくプルリクエストを使用するワークフローの場合は、ソース管理ビューから新しい PR を作成できます。タイトルを提供し、新しいブランチを作成するように求められます。

プルリクエストを作成したら、GitHub Pull Request and Issues 拡張機能を使用して、本トピックの以前のセクションで説明した通りに、PR のレビュー、編集、マージを行うことができます。
仮想ファイルシステム
ローカルマシン上にリポジトリのファイルが存在しなくても、GitHub Repositories 拡張機能はメモリ内に仮想ファイルシステムを作成するため、ファイルの内容を表示し、編集を行うことができます。仮想ファイルシステムを使用するということは、ローカルファイルを前提とする一部の操作や拡張機能が有効にならない、または機能が制限されることを意味します。タスク、デバッグ、統合ターミナルなどの機能は有効ではありません。仮想ファイルシステムのサポートレベルについては、リモートインジケーターのホバーにある features are not available リンクから確認できます。

拡張機能作成者は、仮想ファイルシステムとワークスペースでの実行について、Virtual Workspaces 拡張機能作成者ガイドで詳細を確認できます。
作業を継続する (Continue working on)
ローカルファイルシステムと完全な言語ツール・開発ツールをサポートする開発環境に切り替えて作業したい場合があるでしょう。GitHub Repositories 拡張機能を使用すると、簡単に以下へ移行できます。
- GitHub Codespace の作成(GitHub Codespaces 拡張機能が必要)。
- リポジトリをローカルへクローン。
- Docker コンテナ内へリポジトリをクローン(Docker と Microsoft Container Tools 拡張機能がインストールされている必要あり)。
開発環境を切り替えるには、コマンドパレット (⇧⌘P (Windows, Linux Ctrl+Shift+P)) から利用可能な Continue Working On コマンドを使用するか、ステータスバーのリモートインジケーターをクリックします。

ブラウザベースのエディターを使用している場合、"Continue Working On" コマンドには、リポジトリをローカルで開くか、クラウドホスト型の環境(GitHub Codespaces)で開くかのオプションがあります。

コミットされていない変更がある状態で Continue Working On を初めて使用すると、Cloud Changes 機能を使用して、選択した開発環境に編集内容を持ち込むオプションが表示されます。これは、保留中の変更を Settings Sync で使用されるものと同じ VS Code サービスに保存します。
これらの変更は、ターゲットの開発環境に適用されると、サービスから削除されます。コミットされていない変更を持ち込まずに作業を継続する場合でも、設定 "workbench.cloudChanges.continueOn": "prompt" を後で変更することで設定を更新できます。
保留中の変更がターゲットの開発環境に自動的に適用されない場合は、Cloud Changes: Show Cloud Changes コマンドを使用して、保存された変更を確認、管理、削除できます。
次のステップ
- VS Code での AI - VS Code の AI 機能について学びましょう。