【小ネタ】React の Dockerイメージを作成するときに、サイズを小さくする方法

やったこと

• マルチステージビルドを行う

実際の Dockerfile

FROM debian:bullseye-slim as build

WORKDIR /app

COPY . .

RUN curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add -
RUN echo "deb https://dl.yarnpkg.com/debian/ stable main" | tee /etc/apt/sources.list.d/yarn.list
RUN apt-get update \
&& apt-get install -y yarn nodejs npm \
&& npm install npx -g \
&& npx webpack --mode production \
&& rm -rf /var/cache/apt

FROM debian:bullseye-slim as deploy

WORKDIR /app

COPY --from=build /app/public /app/public

...

node_modules をなくすだけで、実際のイメージサイズが 1/3 以下になりました。
他のコンパイル型の言語ではマルチステージビルドが有効なことはわかっていましたが、
React でも有効なのはいい気づきでした。

終わりに

最後の方は端折っていますが、 Nginx なり静的ファイルをホストする何かを起動してあげれば
無事にアクセスすることができると思います。