Use docker compose watch instead of volumes

[epou]

Description

What are you proposing? How should it be implemented?

Docker just released Docker Compose Watch with v2.22. (NOTE: Instead of docker compose up one should use docker compose watch, so docs should be modified accordingly)

With this feature, the watch option can automatically synchronize the local source code with the code inside the containers without using volumes.

Proposal in file local.yml:

[...]

services:
  django:{% if cookiecutter.use_celery == 'y' %} &django{% endif %}
      build:
        context: .
        dockerfile: ./compose/local/django/Dockerfile
      image: {{ cookiecutter.project_slug }}_local_django
      container_name: {{ cookiecutter.project_slug }}_local_django
      depends_on:
        - postgres
        {%- if cookiecutter.use_celery == 'y' %}
        - redis
        {%- endif %}
        {%- if cookiecutter.use_mailpit == 'y' %}
        - mailpit
        {%- endif %}
-     volumes:
-       - .:/app:z
+     develop:
+       watch:
+         - action: sync
+           path: ./
+           target: /app
+         - action: rebuild
+           path: ./requirements/
  
      env_file:
        - ./.envs/.local/.django
        - ./.envs/.local/.postgres
      ports:
        - '8000:8000'
      command: /start

[...]

   docs:
      image: {{ cookiecutter.project_slug }}_local_docs
      container_name: {{ cookiecutter.project_slug }}_local_docs
      build:
        context: .
        dockerfile: ./compose/local/docs/Dockerfile
      env_file:
        - ./.envs/.local/.django
-     volumes:
-       - ./docs:/docs:z
-       - ./config:/app/config:z
-       - ./{{ cookiecutter.project_slug }}:/app/{{ cookiecutter.project_slug }}:z
+     develop:
+       watch:
+         - action: sync
+           path: ./docs
+           target: /docs
+         - action: sync
+           path: ./config
+           target: /app/config
+         - action: sync
+           path: ./{{ cookiecutter.project_slug }}
+           target: /app/{{ cookiecutter.project_slug }}
+         - action: rebuild
+           path: ./requirements/
      ports:
        - '9000:9000'
      command: /start-docs

[...]

{%- if cookiecutter.frontend_pipeline in ['Gulp', 'Webpack'] %}

  node:
    build:
      context: .
      dockerfile: ./compose/local/node/Dockerfile
    image: {{ cookiecutter.project_slug }}_local_node
    container_name: {{ cookiecutter.project_slug }}_local_node
    depends_on:
      - django
    volumes:
-     - .:/app:z
      # http://jdlm.info/articles/2016/03/06/lessons-building-node-app-docker.html
      - /app/node_modules
+   develop:
+      watch:
+        - action: sync  # NOTE: node_modules already ignored since they're in .gitignore
+          path: ./
+          target: /app
+        - action: rebuild
+          path: package.json

    command: npm run dev
    ports:
      - '3000:3000'
      {%- if cookiecutter.frontend_pipeline == 'Gulp' %}
      # Expose browsersync UI: https://www.browsersync.io/docs/options/#option-ui
      - '3001:3001'
      {%- endif %}

{%- endif %}
[...]

NOTE: Not sure if action sync+restart could be considered as a replacement for watchdog/watchfiles.

Rationale

Why should this feature be implemented?

Easily synchronize local source code with code inside docker containers, even automatically rebuild on requirements.txt/packages.json changes. Improve development experience.

[leetdavid]

I don't think this works with VSCode Dev containers though, since you can't write from within the container back out into the local environment.