ソースコードから理解する技術-UnderSourceCode

手を動かす(プログラムを組む)ことで技術を理解するブログ

Windows 10 で Visual Studio Code の Remote development in Containers を試してみた

タイトルにあるように、WindowsVisual Studio Code Remote を試してみました。意図としては、開発環境ごとにコンテナを用意し、ローカルにいろいろ入れるのは止めたい、というのが希望です。

以下、その時の作業の備忘録です。

事前準備

Developing inside a Container using Visual Studio Code Remote Development
こちらにあるように、Windowsの場合は

をあらかじめインストールしておく必要があるようです。(WSL2が必要なのは意外でした。裏で使っているようですが・・・)

デバッグ実行できるかを試す

事前準備にてインストールしたら
Get started with development Containers in Visual Studio Code
の公式のチュートリアルをやってみました。

一点、チュートリアルでは「vscode-remote-try-node」をVSCode上から落としてきていますが、今回はgithubからgit cloneでローカルのフォルダに直接ダウンロードしました。

ダウンロードしたフォルダをVSCodeで開くと「Folder contains a Dev Container configuration file. Reopen folder to develop in a container (learn more).・・・」というダイアログが右下に表示されるので「Reopen in Container」を押下します。プロジェクト内に「.devcontainer/devcontainer.json」があることによりコンテナ内での開発環境だと判断されるためでしょう。

後はメインのプログラムである「server.js」の適当な箇所にブレークポイントを置き、「F5」を押下すると起動し、ブラウザからアクセスすることでデバッグできることを確認できました。

同じような流れでGolangのサンプルである「vscode-remote-try-go」もローカルにgit cloneしてデバッグを試してみましたが、こちらも「F5」で起動してデバッグすることができました。

まとめ

コンテナでのリモート開発を行うサンプルの「vscode-remote-try-~」はnodeやGolang以外にもJavaPythonなど良く使いそうなものはあるみたいです。まっさらな環境から特定言語の動作環境を作るのは意外と面倒 & ローカル環境が汚れると感じることも多いのですが、開発を行う環境ごとにコンテナを立てれば、そういった懸念も少なるかもしれません。

追記

VSCodeとDockerでMacにGolangの開発環境を作成する | Developers.IO

こちらで紹介されている手順だとコマンドパレットから直接、作りたい環境を指定してコンテナ環境を作ることができそうです。(サンプルではないですが)