VS Code の Remote Development (Preview) を体験

VS Code 1.35.0 から Remote Development Extension (Preview) が使えるようになりました。

marketplace.visualstudio.com

ちなみに、このバージョンから VS Code は Stable と Insider という2つのリリースを出すことになり、それぞれのアイコンもリニューアルされています。

code.visualstudio.com

macOS の VS Code から VirtualBox の仮想マシン(Ubuntu) で Remote Development を使えるように設定してみます。事前に公開鍵認証で SSH できるようにしておく必要があります。

ゲスト OS 側 で /etc/ssh/sshd_config を編集して一時的にパスワード認証を有効化。

PubkeyAuthentication yes
PasswordAuthentication yes

sshd を再起動。

$ sudo systemctl restart sshd

macOS 側で公開鍵をゲスト OS に転送*1

$ ssh-copy-id masa@192.168.33.10
The authenticity of host '192.168.33.10 (192.168.33.10)' can't be established.
  :
Are you sure you want to continue connecting (yes/no)? yes
  :
Number of key(s) added:        1

Now try logging into the machine, with:   "ssh 'masa@192.168.33.10'"
and check to make sure that only the key(s) you wanted were added.

ゲスト OS 側 で SSH のパスワード認証をオフに戻して sshd を再起動。macOS 側で公開鍵認証でログインできることを確認。

$ ssh masa@192.168.33.10

Welcome to Ubuntu 18.04.2 LTS (GNU/Linux 4.15.0-54-generic x86_64)

masa@ubuntu-bionic:~$ 

VS Code に Remote Development をインストールしたら、接続設定を行います。

~/.ssh/config を指定。

f:id:kondoumh:20190706215413p:plain

接続先設定を追加。

f:id:kondoumh:20190706220102p:plain

接続開始。

f:id:kondoumh:20190706215615p:plain

接続に成功するとステータスバーがコネクト状態に。

f:id:kondoumh:20190706220255p:plain

フォルダビューに切り替えるとリモートのフォルダを開くように促されます。

f:id:kondoumh:20190706220801p:plain

Git のリポジトリを clone したフォルダを開くとローカルでプロジェクトを開いている感じになります。ターミナルを開くとすでに SSH 接続状態になっています。

f:id:kondoumh:20190706223255p:plain

当然、リモート側には開発環境を構築しておく必要があります。ホストマシンの VS Code にインストールした言語用拡張については、シンタックスハイライトは効いていますが、コード補完などは動いていません。ここで拡張ビューに切り替えるとリモートマシンのセクションができていて、リモート用に拡張をインストールできるようになっています。

f:id:kondoumh:20190706231257p:plain

Go 拡張をインストールすると、リモートマシンのセクションにアイコンが現れ、拡張に必要な go のライブラリもリモート側にインストールされました。

f:id:kondoumh:20190706231610p:plain

コード補完も効いており、ローカル用の Go 拡張の設定がそのまま適用されている模様。

f:id:kondoumh:20190706231958p:plain

プレビュー版でこの完成度は凄いです。

最近は、EC2 インスタンスやローカルの仮想マシンに SSH して作業することが増えて、マシンを作るたびに Emacs や tmux をインストールするのも面倒なので *2 苦手な Vim を使うことが増えてきています。プログラミング言語だけでなく、YAML の設定ファイルを編集したりするのも VS Code の拡張が使えて、フォルダ構成が一覧できる状態で作業できるのは非常に助かります。

*1:ゲスト OS の ~/.ssh/authorized_keys に追加されます。

*2:特に RHEL / CentOS では自分でビルドしないと最新版が使えなかったり