リモートリポジトリ

2021年6月10日 Brigit Murtaugh, @BrigitMurtaugh, Eric Amodio, @eamodio

注: Remote Repositories拡張機能は、このブログ記事の公開以降、GitHub Repositoriesに名称変更されました。また、最新のドキュメントもご確認ください。拡張機能に関する最新情報が掲載されています。

Visual Studio Code向けの新機能、Remote Repositories拡張機能をご紹介できることを嬉しく思います！ これは、VS Code内でソースコードリポジトリを迅速かつ安全に操作できるようにするために、GitHubの仲間たちと協力して構築してきた新しいエクスペリエンスです。

ソースコードリポジトリをより迅速に開く方法

VS Codeでは、当初からGitの統合サポートを提供しており、拡張機能を通じて他の多くのソースコード管理（SCM）プロバイダーもサポートしてきました。これにより、開発者はVS Code内で直接リポジトリをクローンして作業できるようになりました。

しかし、開発者が日常的に行うことの多くは、他の人のコードを読むことです。プルリクエストのレビュー、オープンソースリポジトリの閲覧、新しいテクノロジーやプロジェクトの実験、アプリケーションをデバッグするためのアップストリーム依存関係の調査などです。これらに共通しているのは、最初のステップとして、通常はリポジトリをローカルにクローンしてから、お気に入りのコードエディター（VS Codeであることを願っています！）でコードを開くことです。しかし、リポジトリのクローン作成には時間がかかり、プルを忘れると古いバージョンのリポジトリを確認することになり、コードに慣れていない場合はセキュリティリスクになることもあります。

GitHubが公開した新しいRemote Repositories拡張機能は、VS Codeでソースコードリポジトリを開くエクスペリエンスを瞬時かつ安全にします。これにより、VS Code内から直接、リモートのGitHubリポジトリ（および近日公開予定のAzure Repos）を迅速に閲覧、検索、編集、コミットできます。クローンは不要です！

マシンにソースコードを保存することなく、好きなだけ多くのリポジトリで作業できます。Remote Repositoriesは、時間とローカルディスクのスペースを節約し、すべてのソースコード管理タスクをVS Code内で完結できるようにします。

このブログ記事では、Remote Repositoriesを使い始めるのがいかに簡単か、最初のリモートリポジトリを開いた後に何ができるか、この仮想環境を支える技術的な詳細、そして今日どのようにフィードバックを提供できるかを探ります。

VS Codeで最初のリモートリポジトリを開く

VS Codeでリモートリポジトリを開いてみましょう。まず、Remote Repositories拡張機能をインストールしていることを確認してください。

現在、Remote RepositoriesはGitHubリポジトリをサポートしており、Azure Reposのサポートも近日中に開始予定です。このブログ記事では、まずVS Codeリポジトリ(microsoft/vscode)を開いてみましょう。

Remote Repositories拡張機能をインストールすると、VS Codeの左下にあるリモートインジケーターをクリックすることで、その[リモートリポジトリを開く]コマンドにすぐにアクセスできます（インストールされている他のリモート開発拡張機能のコマンドも同様です）。

VS CodeからGitHubにログインしたことがない場合は、GitHubアカウントの認証を求められます。ログインしたら、リポジトリまたはPRを検索し、目的のものを選択すれば、準備完了です。

以下の短いビデオでは、VS Codeリポジトリを検索して選択すると、VS Codeがリロードされ、リポジトリの内容がローカルにクローンしたかのように読み込まれます。

VS Codeを離れることなく、リポジトリを探索して貢献できます。使い慣れたVS Codeインターフェースを使用してローカルコードを操作しているように感じられ、VS Codeエクスプローラー、検索、タイムラインビュー、クイックオープン、そしてもちろんソースコード管理などの機能を使用できます。

これで、仮想ワークスペースとして知られるものに接続されました（仮想ワークスペースの詳細については下記を参照してください）。リモートインジケーターには「GitHub」と表示されます。リモートインジケーターにカーソルを合わせると、仮想ワークスペースでは一部の機能が利用できないことが通知されます。

仮想ワークスペースは特別な設定であり、拡張機能など一部の機能は無効になっているか、機能が制限されています。リモートインジケーターにカーソルを合わせたときに表示される[一部の機能]リンクをクリックすると、無効になっている拡張機能を簡単に確認できます。

リンクをクリックすると、無効になっている拡張機能と、機能が制限されている拡張機能が表示されます。機能が制限されているかどうかは、拡張機能にカーソルを合わせると確認できます。

仮想ワークスペースで拡張機能を手動で有効にしたい場合は、ユーザー設定settings.jsonファイルでextensions.supportVirtualWorkspaces設定を使用できます。

    "extensions.supportVirtualWorkspaces": { "<extensionID>": true }

拡張機能は、ローカルファイルシステムへのアクセスなしに仮想ワークスペースを処理するように実装されていない可能性があり、そのため、拡張機能が期待どおりに動作しない可能性があることに注意してください。

リポジトリを開きました。次は？

リポジトリを開くと、Remote Repositoriesを使用すると、プロジェクトへの貢献が容易になります。

プロジェクトを最新の状態に保つ簡素化されたGitワークフロー

Remote Repositoriesは、複雑なGitコマンドを使用せずに、常にリポジトリの最新バージョンを維持するのに役立ちます。

新しいリポジトリを開くときはいつでも、最新バージョンを開きます。また、Remote RepositoriesがGitHubからの新しい変更を検出すると、ステータスバーにプルダウンする必要があるコミット数がリスト表示されます。

そして、エクスプローラーで変更されたファイルを強調表示します。

変更をコミットすると、それらは自動的にGitHubに表示されます。変更をプッシュしたり、作成した新しいブランチを公開したりする必要はありません。

プルリクエストの作成またはチェックアウト

Remote Repositoriesは、GitHub Pull Requests and Issues拡張機能と連携して動作し、VS Codeで直接GitHubからのプルリクエストとIssueをレビューおよび管理できます。2つの拡張機能を並行して使用すると、コードをローカルにクローンしたり、VS Codeを離れたりすることなく、PRをすばやくチェックアウトしてIssueに取り組むことができます。

コードに変更を加え、その変更に基づいて新しいブランチとプルリクエスト（PR）を作成し、PRをチェックアウトできます。すべて数回クリックするだけです。

GitHub Pull Requests and Issues拡張機能の詳細については、GitHubの操作に関する記事をご覧ください。

変更をブランチに分離する

作業を完了する際にブランチを切り替える必要がある場合があります。一般的な環境では、どの変更を一時退避またはコミットするかを決定する必要がある場合、これは厄介なことになります。

Remote Repositoriesを使用すると、異なるブランチで同時に簡単に作業できます。あるブランチでの作業を一時停止して新しいブランチに切り替えても、変更の一時退避を求められることはありません。変更は自動的に前のブランチに残ります。前のブランチに戻ると、変更はそのまま残っており、中断したところから再開できます。

ブランチに変更をプッシュする方法を見てみましょう。

ステータスバーで、現在のブランチ（例：「main」）を選択して、ブランチのリストを開きます。

[+ 新しいブランチを作成...]を選択し、ブランチの名前を入力します。

その後、その新しいブランチに切り替えることができます。

新しいブランチには、前のブランチからの変更は含まれません。

制限事項

Remote Repositoriesを使用する際には、いくつかの制限事項があります。

• デバッグ、ターミナル、およびタスク - 現在サポートされていません。ターミナルはローカルファイルシステムで開き、リモートリポジトリの仮想ファイルシステムにアクセスできません。
• 言語インテリジェンスの制限 - IntelliSenseや[定義へ移動]などの機能は、多くの言語がRemote Repositoriesの仮想化環境をまだ理解していないため、影響を受ける可能性があります。
• 検索 - GitHub検索自体には、ブランチのインデックス作成を行わないなどの制限があります。Remote Repositoriesは、インデックス作成を有効にすることで、この制限を回避し、全文検索を実行できます。インデックス作成では、GitHubからリポジトリの浅いクローンをプルし、ローカルでフル検索を実行することで、GitHubのあいまいなデフォルトブランチネイティブ検索よりも強力な検索機能を提供します。Remote Repositoriesの検索ビューからインデックス作成を有効にできます。
• 拡張機能の制限 - すべての拡張機能が仮想ワークスペースでの実行をサポートできるわけではありませんが、時間の経過とともにサポートする拡張機能が増えていきます。ローカルファイルへのアクセスに大きく依存する拡張機能は、この設定をサポートできません。詳細については、下記の仮想ワークスペースのセクションを参照してください。

私たちはこの道のりを始めたばかりですので、開発を続けるにつれて、機能セットが拡張され、制限事項が縮小されることを期待してください。

より強力な環境で作業を続ける

Remote Repositoriesを使用すると、VS Codeは物理ファイルシステムがないため、すべての機能が利用できるわけではない環境で動作します。これは、リポジトリの閲覧をすぐに開始するには最適ですが、次のような、より「高度な」作業を行う準備ができた場合はどうでしょうか。

• リポジトリで積極的に作業し、VS Codeの全機能を利用したい。
• リモートから定期的にプルして、リポジトリの変更を積極的に追跡する必要がある。

より高度なワークフローに移行するために、Remote Repositoriesは、環境を「アップグレード」して、現在いる場所から作業を続行する方法を提供します。

左下のリモートインジケーターをクリックし、[作業を続行...]を選択します。

3つのオプションが表示されます。

• [リポジトリをローカルにクローン]: 現在のリポジトリをローカルマシンにクローンします。ローカルファイルエクスプローラーがポップアップ表示され、ディスク上の場所を選択してリモートリポジトリをクローンできます。
• [コンテナボリュームにリポジトリをクローン]: Dev Containers拡張機能を使用して、現在のリポジトリをDockerコンテナボリュームにクローンします（Dev Containers拡張機能とDockerがインストールされている必要があります）。VS Codeがリロードされ、Dev Containersを使用して接続し、リモートインジケーターには[Dev Container: {イメージ名}]と表示されます。
• [Codespacesで開く]: GitHub Codespaceで作業を続行します。このオプションを選択すると、ブラウザが開き、このリポジトリのCodespacesリストに移動します。

これで、VS CodeでRemote Repositoriesを使用する方法を説明しましたので、このエクスペリエンスを支える技術的な詳細と、拡張機能がRemote Repositoryセッションで動作することを保証する方法について説明します。

仮想ファイルシステムとワークスペース

このリモートワークを支えるコアコンセプトは、仮想ファイルシステムと仮想ワークスペースです。

エンドユーザーとして知っておく必要があるのは、どのリポジトリまたはPRで作業したいかだけです。VS Codeが仮想ファイルシステムを処理し、ワークスペースを管理します。拡張機能開発者としては、拡張機能が期待どおりに動作するように、仮想ファイルシステムAPIを採用することをお勧めします。

仮想ファイルシステムの仕組み

従来のgitワークフローで作業する場合、「git clone」でリポジトリをクローンし、コピーがコンピューターのローカルファイルシステムに保存されます。しかし、Remote Repositoriesを使用する場合、コードはローカルコンピューターには存在しません。GitHub上にのみ存在します。

物理的にディスク上に存在するファイルから抽象化された仮想ファイルシステムを介してコードを操作します。仮想ファイルシステムは、GitHubのようなコードホスト、クラウドストレージ、またはデータベースからコンテンツを提供し、これらをVS Codeのユーザーにファイルとしてシームレスに提供できます。

仮想ファイルシステムでワークスペースを開くと、仮想ワークスペースと呼ばれます。仮想ワークスペースで作業している間も、拡張機能を含むVS Codeの機能にアクセスできます。

拡張機能が仮想ワークスペースで動作するようにする

拡張機能が適切に動作するためには、仮想ファイルシステムをサポートする必要があります。

拡張機能にコードがなく、純粋なカラーテーマ、キーバインド、スニペット、または文法拡張機能である場合、仮想ワークスペースで実行でき、採用は不要です。

実際のコードを実行する拡張機能、つまりメインエントリポイントを定義する拡張機能は、検査と場合によっては採用が必要です。

仮想ファイルシステムのAPIサポートは、FileSystemProviderインターフェースを通じて行われます。ファイルシステムプロバイダーは、新しいURIスキーム（例：vscode-vfs）に登録され、そのファイルシステム上のリソースは、そのスキーマ（vscode-vfs://github/microsoft/vscode/package.json）を使用するURIで表されます。

拡張機能のpackage.jsonにはcapabilitiesプロパティがあり、virtualWorkspacesサブプロパティは、拡張機能が仮想ワークスペースで動作するかどうかを通知するために使用されます。

仮想ファイルシステム、ワークスペース、および拡張機能への実装方法の詳細については、仮想ワークスペース拡張機能作成者向けガイドをご覧ください。

フィードバックと関連資料

Remote Repositoriesをぜひお試しいただき、皆様からのフィードバックをお待ちしております。

Remote Repositories拡張機能をインストールしてください。Issueや機能リクエストを提出するか、@codeまでツイートでご意見をお聞かせください。

Remote Repositories拡張機能の使用方法に関する新しいYouTubeビデオもご覧ください。

拡張機能の作成者の方は、拡張機能作成者向け仮想ワークスペースサポートガイドをご覧になり、ご質問やフィードバックがあれば追跡Issueでお知らせください。また、拡張機能作成者コミュニティのSlackグループにもご参加いただけます。

ハッピーコーディング！

Brigit Murtaugh, VS Codeプログラムマネージャー @BrigitMurtaugh
Eric Amodio, VS Codeプリンシパルソフトウェアエンジニア @eamodio