概要

Visual Studio Code (以下、VSCode）の Remote ContainersでNodeコンテナを作成し、仮装環境で開発する。

環境

本記事を記載時点でのバージョン等を記載する

• macOS Big Sur 11.2.1
• VSCode 1.53
• Remote - Containers v0.158.0

手順

1. Nodeを使用するフォルダを作成
2. VSCodeのNew Windowで新しいWindowを開く
3. Open folderで作成したフォルダを開く
4. コンテナ設定ファイルを作成する
   1. 左下のRemote Containerのボタン(><が重なったようなマーク)をクリック
   2. コマンドパレットが開くので、Remote-Containers: Add Development Container Configuration Files...を選択
   3. Node.jsを選択
   4. バージョンを選択（この記事では14を選択)
5. コンテナ仮装環境を開く
   1. 左下のRemote Containerのボタン(><が重なったようなマーク)をクリック
   2. Remote-Containers: Reopen in Containerをクリック
6. 以上で開発環境の準備が整いました
7. 終了する場合
   1. 左下のRemote Containerのマークをクリック
   2. ```Close Remote Connectionを選択

参考） Docker-compose.ymlで設定する場合

docker-compose

{"name":"Node-test","dockerComposeFile":"docker-compose.yml","service":"app","workspaceFolder":"/dir","settings":{"terminal.integrated.shell.linux":"/bin/zsh"},"extensions":["dbaeumer.vscode-eslint"],"remoteUser":"node"}

version:'3'services:app:build:context:.dockerfile:Dockerfilecommand:sleep infinityvolumes:-..:/dir

ARG VARIANT="14"
FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:0-${VARIANT}
CMD [ "sleep", "infinity" ]