Docker Compose Watchで開発環境のホットリロードを設定する方法

問題

Dockerで開発する際、コードを変更するたびにdocker compose up --buildを実行するのは非効率です。ボリュームマウント（volumes）を使う方法もありますが、node_modulesの競合やOS間のファイル監視の問題が発生します。

解決方法

Docker Compose 2.22以降、watch機能が追加されました。compose.yamlにdevelop.watchセクションを追加します。

services:
  web:
    build: .
    ports:
      - "3000:3000"
    develop:
      watch:
        # ソースコード変更 → コンテナに自動同期
        - action: sync
          path: ./src
          target: /app/src

        # package.json変更 → イメージリビルド
        - action: rebuild
          path: ./package.json

        # 設定ファイル変更 → コンテナ再起動
        - action: sync+restart
          path: ./config
          target: /app/config

実行方法はこちらです。

docker compose watch

3つのアクションがあります。

sync: ファイルをコンテナに直接コピーします。ソースコードの変更に適しています
rebuild: イメージを再ビルドしてコンテナを置き換えます。依存関係の変更に適しています
sync+restart: ファイルをコピーしてからコンテナを再起動します。設定ファイルの変更に適しています

特定のファイルを除外したい場合はignoreを使います。

        - action: sync
          path: ./src
          target: /app/src
          ignore:
            - "**/*.test.ts"
            - "**/__snapshots__"

ポイント

docker compose watchはファイル変更を検知して自動で同期/リビルド/再起動します
ボリュームマウントと違いnode_modulesの競合がありません
sync、rebuild、sync+restartの3つのアクションで変更タイプに応じた対応が可能です
ignoreで不要なファイル変更をフィルタリングできます
Docker Compose 2.22+が必要です（Docker Desktop 4.24+）