Hugo+AsciidoctorのDocker環境を整える


はじめに

4年ぶりにブログを書きます. すべてを忘れてしまったので,昔の記事を頼りにHugo+Asciidocの環境を整えます.

環境構築

Hugo+Asciidocで必要なパッケージは以下の通り.

  • Hugo

  • Ruby

  • Gem

  • Asciidoctor

HugoはともかくAsciidoctorがRuby(Gem)に依存しているので,gemでトラブルにあう前にDockerに隔離します.

Dockerfile

FROM ubuntu:22.04

ENV TZ=Asia/Tokyo
RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone
ENV DEBIAN_FRONTEND=noninteractive

RUN \
  useradd -m -s /bin/bash -u 1000 writer

# install ruby for gem
RUN \
  --mount=type=cache,target=/var/lib/apt \
  --mount=type=cache,target=/var/cache/apt \
  apt-get update && \
  apt-get install -y ruby-full rubygems

# install asciidoctor and plugins
RUN \
  gem install \
  asciidoctor \
  asciidoctor-diagram \
  asciidoctor-pdf \
  asciidoctor-revealjs \
  pygments.rb \
  rouge

# install python for pygments.rb
RUN \
  --mount=type=cache,target=/var/lib/apt \
  --mount=type=cache,target=/var/cache/apt \
  apt-get update && \
  apt-get install -y python3 python3-pip

# install hugo
RUN \
  --mount=type=cache,target=/var/lib/apt \
  --mount=type=cache,target=/var/cache/apt \
  apt-get update && \
  apt-get install -y hugo

USER writer
WORKDIR /home/writer/data

CMD ["/bin/bash"]

Dockerfileと同じ階層に compose.yaml を作成します.

services:
  hugo:
    image: hugo-adoc-writer:latest
    build:
      context: .
      dockerfile: Dockerfile
    container_name: hugo
    network_mode: host
    volumes:
      - ../:/home/writer/data
    ports:
      - 1313:1313
    working_dir: /home/writer/data
    command: hugo server -D

上の例では,compose.yaml の一個上の階層にHugoのrootディレクトリがあることを前提にしています.

以下のコマンドでビルドします.

docker compose build

実行

以下のコマンドでDockerコンテナを起動します.

docker compose up

そうするとコンテナ内の /home/writer/data にマウントされ, hugo server -D コマンドが実行されます. localhost:1313/blog にアクセスするとHugoのプレビューが確認できます.

あとは適当なエディタで編集するだけです. Hugoのrootディレクトリ下の変更を監視しているため,保存すれば勝手に更新されます.