背景

今月始めにMicrosoftからRemote Development Extension Pack. というのが発表された。簡単に言うと、VSCodeでコードを書くOSとプラグインが実行されるOSを別にすることが出来る。

よくあるパターンで、「MacでNokogiriがビルドできません」「WindowsでESLintを実行するにはどうしたら良いですか」みたいな質問がある。
最終的にサービスを公開するときにはどうせLinux使うのに、開発するときしか使わない別のOSで同じものを動かす苦労って無駄だよなあ、と思っていた。

じゃあ最初からLinuxで開発すればいいかというと、最近の高度化したWeb開発はIDEの支援なしに実行することが困難で、RubyだったらRuboCop、JavaScriptだったらPrettierやESLintで文法チェックしてもらわないと人類にはついていけない。これらを動かすためには開発環境をIDEと同じOSで動かす必要があって、そのためには上記の質問に悩まないといけない...というのが実情だった。

そういう悩みを解決するのが、VSCodeのRemoteDevelopmentだ。VSCodeはWindowsやMacで動かしつつ、SSHやDocker、WSLなどで動作するLinuxマシン上にあるソースコードを編集し、linuxマシン上でプラグインを動かすことが出来る。つまり、Windows/MacにはVSCodeさえあればよくて、ほかは全部Linux上で実行することが出来る。もはやNokogiriのビルドに悩む必要がなくなる！

やってみた

インストール

やり方はここで解説されている。早速やってみた。
Remote Development with VS Code

Remote Developmentはまだベータ版の機能なので、実行するためにはInsiders というβ版を使う必要がある。これは既存のVSCodeとは別のアプリケーションとして動作して、既存の環境を壊さないのでむしろ便利かも。

インストールが完了したら、ExtenstionsからRemoteDevelopmentをインストールする。ブラウザで開いてInstallクリックすると既存のVSCodeの方に入っちゃうので注意。サイドバーのExtenstionから「Remote Development」と入力してインストールする

マシンに接続

Linuxマシンに接続する方法はいろいろあるけど、今回は既存のマシンにlinux接続することにした。Ctrl+Chift+P でコマンドパレットから"Remote-SSH: Connect to Host"を実行

WindowsのPuttyで接続を管理していると、その設定ファイルの内容をインポートしてくれる(！)

ハマりポイント：Linux側にtmuxが入っているとうまく接続できないので、bash_profile編集して外して上げる必要がある。

接続完了。Open Fileを選ぶと、linuxマシン上のファイルを編集することになっている。

プラグインを使う

ここまではSSH経由でファイルマウントしたりする機能を使えばできないこともなかったので、今までできなかったことに挑戦。

ExtenstionからESLintとPrettierをインストール。WindowsのVSCodeからインストールしても、linuxで実行したほうが良い機能はlinux側にインストールされる。なにそれすごい...

設定から、Format on Saveを有効に。

で、こういう許されないJavaScriptを書いて保存すると...

勝手に整形される。ぼくらが夢見ていた機能！WindowsにはVSCodeしかインストールしていないのにlinuxの機能が使える！

Prettierだけだと、ぶっちゃけlinux上で上書きされたファイルを読んでるだけのような気もするので、あとでESLintも試してみよう

まとめ

ということで、WindowsにインストールしたVSCodeからlinuxの開発ツールの支援を受けつつコードを書くことが出来るようになった。

さいきんMacイケてないと思わない？ とかっこいいこと言ってSurfaceに移ったのだけど、パワー不足で仮想マシンを使うのが辛かったり、hyper-Vでlinux動かしてもESLintが使えなかったりして、やっぱりMacに戻らないと駄目かなあ、もうちょっとなんとか...と思っているところだった。

RemoteDevelopmentがあれば、ネットの向こうで実行しているlinux VPSに対してVSCodeの各種支援機能を実現することが出来る。こうなってしまえば、もはやWindowsであれが動かないこれが動かないと悩む必要がなくなる。

数年前まで、開発マシンをインターネットの向こうに置くと、通信環境が確保できないと開発できないのがネックだったんだけど、最近どこでも無線LAN使えるし、テザリングもあるので、SSHでつなぐ程度の回線で良ければほぼ人権レベルに確保できるようになってきた。

この先５Gのモバイル接続が普及すれば、インターネット上で開発する動きはますます加速することが予想される。そういう予想のもとに提供されたのがAmazonのCloud9だったんだけど、MicrosoftはVSCodeという強力なツールに機能を追加することで同様の機能をよりスマートに実現してみせた。

GitHubの買収、TypeScript、VSCodeの提供と、あっという間にWEB開発の主流を抑えつつあるMicrosoftが、唯一ネックだったIDEの実行環境を埋めるツールを出してきて、最近のMicrosoftはイケてるよね。