既存のGatsbyプロジェクトをDocker化した。

はじめに

既存のGatsbyプロジェクトをDockerで起動できるようにしました。色々学ぶことが多かったので、恐れ多いながら記事にしてみようという試みです。何かの参考になれば嬉しいです！

• 環境
  • macOS Monterey
• プロジェクト概要
  • フレームワーク: Gatsby
    • Gatsbyのバージョン: 3
  • パッケージマネージャ
    • yarn
• 対象者
  • 「既存のGatsbyプロジェクトをDocker化したい！」という方。

Dockerfile,docker-compose.yml周り

最終的に、以下のような内容のDockerfileとdocker-compose.ymlを作成したらうまくいきました。もちろん、これが最善策だとは思ってないです。「ここはこうした方がいいよ！」などのご指摘がありましたら、ぜひコメントなどでお伝えいただきたいです！
Dockerfileはこちら↓

# NOTE: nodeをベースイメージにすると、sharp周りでエラーが起きる。cf. https://gotohayato.com/content/548/
FROM node:16-bullseye

# NOTE: WORKDIRの値は、有効な任意のディレクトリ名
WORKDIR /sample

COPY . ./
# NOTE: 念の為node_modulesを削除。cf. https://github.com/lovell/sharp/issues/2443
RUN rm -rf node_modules 
RUN yarn install
RUN yarn global add gatsby-cli

ENTRYPOINT [ "gatsby","develop","-H", "0.0.0.0", "-p", "8000" ]

docker-compose.ymlはこちら↓

docker-compose.yml

version: '3'
services:
  sample:
    build: .
    volumes:
      - ~/.ssh/:/root/.ssh
      - .dockervenv:/src/.venv
      - .:/src
    env_file:
      - .env.development
    ports:
      - 8000:8000

この記述の上でdocker-compose up（初回は--buildオプションをつける）を実行すれば、localhost:8000でプロジェクトが起動するはずです。

以下、上記コードについていくつか説明を加えていきます。

Dockerfileの記述について

まずはFROMについて。

FROM node:16-bullseye

最初は「FROM node:16.x.x」のように書いていたんですが、この記述だと以下のようなエラーが生じました。

sharp: Installation error: Use with glibc 2.28 requires manual installation of libvips >= 8.10.6

これについては、こちらの記事を参考にベースイメージを変えることで対処しました。

続いて、ENTRYPOINTについて。

ENTRYPOINT [ "gatsby","develop","-H", "0.0.0.0", "-p", "8000" ]

こちら、["gatsby","develop"]だけではうまくいきませんでした。ホストとポートを指定する必要がありそうです（参考: https://www.gatsbyjs.com/docs/reference/gatsby-cli/#develop ）。

docker-compose.ymlの記述について

docker-compose.ymlはこちらの記事を参考にさせていただきました。まあでも正味、あまり理解できてないです（特にvolumes周り）。。どなたか、解説いただけますと幸いです。

最後に

手探りで取り組んだこともあり至らない点多数だとは思いますが、何かの参考になれば嬉しいです。

また、この記事の内容についてアドバイスや訂正などございましたら、ぜひコメントなどでお知らせいただけますと幸いです。