Docker上でVSCodeを立ち上げ、ホストアプリのように使う #docker-compose

目的

下記のような使用方法を想定しています。

複数の開発プロジェクトを持っている人の開発環境（プロジェクトごとに違う設定を使う）
VSCodeの拡張機能の評価検証

動作イメージ

今回解説する方法で立ち上げた場合、使い方と画面イメージの概要を記載します。

docker-compose ファイルを作成
sudo docker-compose up コマンドでコンテナ立ち上げ
コンテナ立ち上げと同時にVSCode起動
VSCode上での日本語入力や拡張機能の導入も可能
VSCodeを終了と同時にコンテナも終了
コンテナを再起動すると前回の状態を引き継いでVSCode起動

■実際に実行した際の画面イメージ

コンテナの起動方法

ファイル構成

[適当な名前のディレクトリ]
　├ code
　├ Dockerfile
　└ docker-compose.yml

ファイルの内容

code（ディレクトリ）

ホスト・コンテナで共有したいファイルを格納するディレクトリ
必ずホスト側で作成する

Dockerfile

任意のユーザーを作成してコンテナイメージを作成するためのコードを記載しています。
ユーザー情報を指定せず作成した場合は、グループ名・ユーザー名・パスワードともvscodeで作成します。

Dockerfile

FROM sabotagecla6/vscode_base

# ***********************************************
# install packages
# ***********************************************
ARG group_id
ARG user_id
ARG group
ARG user
ARG passwd
ENV default_group="vscode"
ENV default_group_id=1000
ENV default_user_id=1000
ENV default_user="vscode"
ENV default_passwd="vscode"

RUN { \
    group_id=${group_id:=$default_group_id}; \
    user_id=${user_id:=$default_user_id}; \
    group=${group:=$default_group}; \
    user=${user:=$default_user}; \
    passwd=${passwd:=$default_passwd}; \
    user_home="/home/"${user}; \
    groupadd -g ${group_id} ${group}; \
    export HOME=${user_home}; \
    useradd -d ${user_home} -m -s /bin/bash -u ${user_id} -g ${group_id} -G 27 ${user}; \
    echo ${user}:${passwd} | sudo  chpasswd; \
    chown ${user} ${user_home} ; \
}

USER ${user}

docker-compose.yml

上記のDockerfileをもとにコンテナイメージを作成して、
コンテナ起動時にVSCodeをcodeディレクトリを開いて立ち上げます。

docker-compose.yml

version: "3.3"
services:
  vscode:
    build: 
        context: ./
        dockerfile: Dockerfile
        args:
          user: mint
          passwd: mint
    volumes:
      - $HOME/.Xauthority:/root/.Xauthority
      - ./code:/home/mint/code
    user: "1000:1000"
    shm_size: '2G'
    network_mode: "host"
    privileged: true
    environment:
      DISPLAY: $DISPLAY
    command: code -w code

コンテナの起動

sudo docker-compose up

ホストに入れる場合との違い

開くディレクトリを切り替えられない

VSCodeでディレクトリを開く場合、一度プロセスが終了してから再度立ち上がるようにです。
本コンテナは一度VSCodeが終了すると、コンテナも終了するように作っていますので、
コンテナ起動後VSCodeのアプリの機能としてフォルダを開くを利用することができません。
（そのような使い方が必要な場合を想定していないため）

日本語入力の際の画面の動きが違う

通常VSCodeで日本語入力する場合は、リアルタイムでVSCode上に文字が表示されます。
しかし、本コンテナで立ち上げる場合は、mozc上で確定するまでVSCodeには反映されません。