VS Code で GitHub 上のリポジトリを直接参照できる「Remote Repositories」を試してみた

本日 2021/06/11 に Visual Studio Code 1.57 がリリースされました?
リリースノートの中にあった「Remote Repositories」がとても唆るものだったので紹介したいと思います。

（実は Preview Feature として 1.56 に搭載されていた機能です。Terminal tabs しか見てなかった……）

現段階ではプレビュー版の機能になります。

Remote Repositories のざっくり機能説明

GitHub 上のリポジトリをローカルに clone することなく VS Code で直接参照できる機能です。

これにより GitHub 上でリポジトリ内の検索するよりもより使い慣れた画面で検索が行えるようになったり、VS Code の豊富で強力な拡張機能によってブラウザ上でのコード閲覧よりもリッチな体験が得られたり、更にはブランチ切って編集して commit して push して Pull Request を作成するといった git/GitHub の操作を一連して VS Code で完結することができます。

（画像は https://github.com/microsoft/vscode-remote-release より引用）

ただし Remote Repositories で開いている状態で yarn install といったローカルに環境構築するようなコマンドは実行できません。確認後の操作も考慮されておりソースコード確認後に clone するか GitHub Codespaces で開発を続けるかを選択できるようになっています。

インストール

拡張機能として提供されています。Remote Repositories をインストールしましょう。

次にコマンドパレットもしくは左下の「><」のようなアイコンから「Remote Repositories: Open Repository...」を選択し、「Open Repository from GitHub」を選択します。

この時に GitHub の認証が必要になります。ブラウザが開いて GitHub のログイン画面が表示されるので認証情報を入力しこの拡張機能を許可してください。そして VS Code に戻ります。

以上で使えるようになりましたのでインストール作業は終わりとし以下に続きます。

Remote Repositories で VS Code のコードを閲覧してみる

先ほどの「Open Repository from GitHub」からの続きになります。

「Choose a repository」と自身や自身の所属する組織が保有するリポジトリ一覧が表示されているでしょう。ここで好きなリポジトリを選択すれば簡単に開くことができます。

今回は VS Code のリポジトリを参照したいと思います。といってもやり方は簡単で microsoft/vscode と 「username/repository name」 の書式で入力するとリポジトリの検索も行ってくれます。

はい、開きました。
同じく 1.57 で追加された制限モードによって開かれています。もし制限モードで操作に支障が出る場合は左下の制限モードをクリックし、信頼するボタンを押してください。閲覧や軽い編集だけが目的ならば制限モードのままで十分使えます。

試しに VS Code の License に関する文言を全文検索してみたいと思います。

様々なところで License について記述されており、microsoft/vscode 自体は MIT License なのが特定のファイルを開くまでもなく一発で分かりますね。

ちなみに GitHub 上で同じように License でリポジトリ内検索を行った場合は以下のようになります。

一画面内で視認性やシンタックスハイライトの有無や検索条件の絞り込みや正規表現での検索など機能的には大きな差があります。GitHub 上のリポジトリを参照したいときは Remote Repositories が大きな助けになってくれるでしょう。

まとめ

• Remote Repositories はいいぞ！
• GitHub 上のリポジトリを直接参照できるぞ！
• もちろん編集もできてそのまま Pull Request の作成までの一連の操作ができるぞ！
• 特に GitHub 上のリポジトリ内の検索が捗るぞ！
• ただし現段階ではまだプレビュー版だよ

URL

• https://marketplace.visualstudio.com/items?itemName=github.remotehub
• https://code.visualstudio.com/updates/v1_57