🃏

マイ Claude Code Dev Container デッキ

に公開

内容

私が普段 Claude Code を全力でぶん回したいときに使っている Dev Container 環境の紹介をする。
ほぼそのまま動くサンプルも用意している。

https://github.com/Creanciel/ZennClaudeCodeDevContainerBaseImage

https://github.com/Creanciel/ZennClaudeCodeDevContainer

Dev Container で Claude Code を使う意味

昨今、IT エンジニアの誰もが Claude Code のようなコーディングエージェントを使っている。しかし時々聞く話だが git でリポジトリを吹き飛ばしたり、DB を吹き飛ばしたり、/ ディレクトリから吹き飛ばしたり、様々なトラブルを起こしている。

特に WSL を使っているなら /mnt/c/ に Windows 側の C ドライブがマウントされているため、/ ディレクトリを消そうものなら Windows 側も吹き飛ぶ。

そうでなくても個人的には LLM に一切のクレデンシャルを渡すことを良しとしていない。

一方で私は Claude Code を作業している横でぶん回したい。
いちいち許可を求めて待機しないでほしい。

これがモチベーションである。

Dev Container

一応 Dev Container の話をしておく。

もともとは Microsoft が VSCode 向けに開発環境を仮想環境で動かすことを目的としたものである。

設定ファイルである .devcontainer/devcontainer.json と任意で Dockerfile を使い、仮想環境を設定する。

使用感としては code-workspace を開くように、VSCode の右下から "Dev Container で開く" ようなダイアログが出てくるのでそこから開くことができる。

コマンドパレットからも開ける。

ベースイメージ

Dev Container では Docker のベースイメージか、 Dockerfile からビルドして作成することができる。

普通にベースイメージを取ってくるのはとりあえず動かすなら大丈夫なのだが、私の場合 Rust のベースイメージだけあっても時々 Node が使いたかったり、 Ruby を使いたかったり単一イメージで完結することは少ない。

Dockerfile に書いて定義するのもありだが、 Ruby など入れようとするとビルドの時間が発生したりパッと使いたいときに取り回しが悪い。

私は Dev Container のためのベースイメージを GHCR においてそれを引っ張るようにしている。

https://github.com/Creanciel/ZennClaudeCodeDevContainerBaseImage

Rust と mise で Node, Ruby, Python を入れている。

https://github.com/Creanciel/ZennClaudeCodeDevContainerBaseImage/blob/5dfe44766e63667e89d8bfc6b9b336cb035067f8/docker/Dockerfile#L58-L64

Dev Container 内で git push をさせる気はないのだが VSCode 拡張で git graph などを使いたいので一応 git も入れておく。
ssh を渡さないのであればせいぜい commit されるぐらいで push されることは無い。

https://github.com/Creanciel/ZennClaudeCodeDevContainerBaseImage/blob/5dfe44766e63667e89d8bfc6b9b336cb035067f8/docker/Dockerfile#L20-L23

あと Dev Container 内で Locale 周りの警告が出るのでその辺の設定を有効化しておく。

https://github.com/Creanciel/ZennClaudeCodeDevContainerBaseImage/blob/5dfe44766e63667e89d8bfc6b9b336cb035067f8/docker/Dockerfile#L44-L46

Dockerfile を設定できたら GitHub Actions で勝手にビルドしておいてもらう。
イメージサイズが大きいが頻繁に pull したりするものでもないだろうし問題ない。

あと特に漏れても困らないので私は Public で GHCR で公開している。

https://github.com/Creanciel/ZennClaudeCodeDevContainerBaseImage/blob/5dfe44766e63667e89d8bfc6b9b336cb035067f8/.github/workflows/release.yaml#L52-L61

Dev Container 設定

リポジトリは変わりこちらである。

https://github.com/Creanciel/ZennClaudeCodeDevContainer

まず Dockerfile は次のように定義されている。

https://github.com/Creanciel/ZennClaudeCodeDevContainer/blob/a11c77dd24db43211dfe8c4c33ef4288e4483d30/.devcontainer/Dockerfile#L1-L5

Claude Code だけ頻繁に更新がかかるのでここでインストールするようにしている。

プロジェクト個別の設定はここですればいいだろう。

そして Dev Container のメインの設定が devcontainer.json である。

https://github.com/Creanciel/ZennClaudeCodeDevContainer/blob/main/.devcontainer/devcontainer.json

Claude Code を動かすためには基本的に

  • ~/.claude/
  • ~/.claude.json

が必要である。
そのために Dev Container 起動前に実行される initializeCommand で次のように設定している。

https://github.com/Creanciel/ZennClaudeCodeDevContainer/blob/a11c77dd24db43211dfe8c4c33ef4288e4483d30/.devcontainer/devcontainer.json#L6-L9

mkdir -p ${localEnv:HOME}/<SETTINGS_DIRECTORY>/devcontainer/<DEVCONTAINER_PROJECT>/.claude && \
cp ${localWorkspaceFolder}/.devcontainer/settings.json ${localEnv:HOME}/<SETTINGS_DIRECTORY>/devcontainer/<DEVCONTAINER_PROJECT>/.claude/settings.json && \
touch ${HOME}/<SETTINGS_DIRECTORY>/devcontainer/<DEVCONTAINER_PROJECT>/.claude.json

<SETTINGS_DIRECTORY> はどこでもよい。
ホームディレクトリに ".devcontainer" と置くのが憚られたので私は ".creanciel" のように "." + ユーザー名 を入れて使っている。

<DEVCONTAINER_PROJECT> も project ごとに Claude の情報を分けたかったので分けている。

やっていることは Docker 内にマウントするための

  • ~/.claude/
  • ~/.claude.json

を作成している。
これらのファイルが無いと Docker でマウントしようとしたときに失敗する。
また外部からマウントしないとアクセスするたびに Claude Code のクレデンシャルを設定しないといけなくなるのでこのようになっている。

あと ${localWorkspaceFolder}/.devcontainer/settings.json をコピーしている。
これは強い権限を与えた Claude の設定ファイルである。
他にも足りなければどんどん追加してほしい。

https://github.com/Creanciel/ZennClaudeCodeDevContainer/blob/main/.devcontainer/settings.json

Dev Container の初回起動時は .claude.json は当然 touch しただけのからファイルなので
2. Reset with default configuration を選んで初期化する。

ホストの Claude Code の設定を使う

Claude Code の設定ファイルなどを好きなところで定義してもいいのだが、これをすると DevContainer ごとに Claude の認証をしなければならなかったり、 ccusage の統計情報に載らなかったりする。

そんな時は普通にホームディレクトリの設定ファイルをマウントするのもありである。

https://github.com/Creanciel/ZennClaudeCodeDevContainer/blob/a11c77dd24db43211dfe8c4c33ef4288e4483d30/.devcontainer/inherit_host_settings.devcontainer.json#L12-L14

しかしこれをすると先ほどの強い権限の settings.json が使えなくなる。 initializeCommand でやっていたことは settings.json をホスト側においてマウントしていたためである。 settings.json は ~/.claude/ 配下であるため、このファイルを編集してしまうとホスト側も汚染してしまう。

この時はプロジェクトディレクトリの .claude/settings.json に先ほどのファイルを置いておくとそれを読んでくれる。

適宜これらを使い分けるとよい。

まとめ

最近は作業の片手間に Dev Container で自分用の技術書を書かせるのがお気に入りの使い方である。

私はあまりメイン環境を汚されたくないので Dev Container はとてもありがたい機能だ。

Claude Code に限らず Dev Container を活用していけたらと思う。

Discussion