Rerender on file change in Docker setup

[kevinlinxc]

I want to set up Hugo with Docker, so that it is easier to develop on my open source hugo project.

To do so, I Dockerized my hugo project so that users can just docker compose up the project and avoid installing go, hugo, etc.

However, this has broken the connection between the content of the directory and the live refresh of the website, i.e. changing files doesn’t cause the site to detect and reload anymore. This is clearly because the files in the Docker container are not changing, since they are copied in at build time. So, is there a way to achieve what I want - easy docker setup but with the rerendering feature that makes Hugo so great to work with?

[razon]

You’ll need to mount the site as a volume other than copy it to the container. Take the hugomods’s docker images for example, docker compose should be similar.

1. Change root to your site.

$ cd my-site

2. Optional: install NPM packages

You may need to install your site’s dependencies via npm before running the Hugo server.

$ docker run \
  -v ${PWD}:/src \
  hugomods/hugo:exts \
  npm i

3. Running Hugo server

$ docker run -p 1313:1313 \
  -v ${PWD}:/src \
  hugomods/hugo:exts \
  hugo server --bind 0.0.0.0

[kevinlinxc]

I actually found a way which is more convenient for me. Docker compose has an experimental feature that syncs local files with the container’s files: Docker Compose Experiment: Sync Files and Automatically Rebuild Services with Watch Mode

My Dockerfile is simply:

FROM hugomods/hugo:latest


COPY . /src/

EXPOSE 1313

ENTRYPOINT [ "hugo", "server"] 

And my docker-compose.yml is:

version: '3'
services:
  hugo:
    build: .
    ports:
      - "1313:1313"
    x-develop:
      watch:
        - action: sync
          path: ./content
          target: /src/content

In my terminal, I run

docker compose up -d && docker compose alpha watch

…and everything works as if I was running Hugo locally!