devcontainer.jsonを手動で作成する

2024-06-10 2024-06-13 3分58秒

vscodeのDevcontainer拡張機能のdevcontainer.jsonを手動で作成するのに自分なりの必要最低限をまとめる。

以下のような構成でファイルを置く。

/workspace/.devcontainer/devcontainer.json
/workspace/docker-compose.yml
/workspace/Dockerfile
/workspace/.env

.devcontainerディレクトリを作り、その中にdevcontainer.json を作り以下のようにする

{
    "dockerComposeFile": "../docker-compose.yml",
    "service": "react",
    "workspaceFolder": "/workspace",
    "containerUser": "myuser",
}

次にdocker-compose.ymlを以下のようにする。react というサービス名にした。

services:
  react:
    build:
      context: .
      args:
        - http_proxy
        - https_proxy
        - USER_UID
        - USER_GID
    environment:
      - http_proxy
      - https_proxy
    volumes:
      - ./:/workspace
    command: bash
    tty: true
    ports:
      - 3000:3000

次にDockerfile 。コンテナ内の開発用ユーザをmyuserとして用意する。USER_UID、USER_GID はビルドの引数として受け取る。USER_UIDやUSER_GIDはローカル環境と同じUID、GIDにすることでコンテナ内で生成されたファイルの所有権を同一にするものである。

#
# 開発用
#
FROM node:22-bookworm


ARG http_proxy
ARG https_proxy
RUN apt update -y &&\
    apt install -y git curl
WORKDIR /workspace

# Set default values for UID and GID if not provided
ARG USER_NAME=myuser
ARG USER_UID=$USER_UID
ARG USER_GID=$USER_GID

# Create a non-root user with a specific UID and GID
RUN groupadd -g $USER_GID $USER_NAME \
    && useradd -u $USER_UID -g $USER_GID -ms /bin/bash $USER_NAME

# Change ownership of the working directory
RUN chown -R $USER_NAME:$USER_NAME /workspace

続いて.env ここでUID、GIDを指定することで開発コンテナ内のUID、GIDを柔軟に変更できるようにする。