docker로 gatsbyjs 빌드 및 제공

최근에 작업한 프로젝트에서 docker 컨테이너에서 gatsbyjs 프로젝트를 호스팅하는 방법을 찾아야 했습니다.gatsbyjs docker 에 대한 빠른 검색 후, 대부분의 결과는 gatsbyjs가 official docker images ,
그러나 README에 표시된 것처럼 사용할 때

FROM gatsbyjs/gatsby:onbuild as build

FROM gatsbyjs/gatsby
COPY --from=build /app/public /pub

문제를 검색한 후 작동하도록 할 수 없었지만 docker images needs to be updated 아직 열려 있으므로 문제를 직접 해결하기로 결정했습니다.

다단계 도커 빌드

Docker에는 기본적으로 dockerfile을 구조화할 수 있는 multistage build이라는 멋진 기능이 있습니다.
최종 이미지의 크기를 최소화하는 방식으로. 전통적인 dockerfile은 다음과 같습니다.

FROM node:14.11.0
#
# Install and setup nginx to serve static files, removed for brevity.
#
WORKDIR /app

COPY package.json package-lock.json ./
RUN npm ci

COPY . ./
RUN npm run build

RUN mv /app/public /usr/share/nginx/html

이것은 작동하지만 Dockerfile의 맨 위에 있는 FROM node:14.11.0 행을 볼 수 있습니다. 즉, 최종 이미지에 노드가 포함되고 애플리케이션이 빌드해야 하는 모든 종속성이 포함됩니다.
더 나은 방법이 있습니다.

다단계 진입

FROM node:14.11.0 AS builder
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm ci
COPY . ./
RUN npm run build

FROM nginx:alpine
COPY --from=builder /app/public /usr/share/nginx/html

보시다시피 비슷하게 시작하는 것을 볼 수 있습니다. node:14.11.0 이미지를 사용하는 하나의 단계가 있습니다. 모든 것을 설정하고 생성된 개츠비 사이트가 있는 공용 폴더를 빌드합니다.
그러나 파일 끝에 새 파일FROM nginx:alpine이 있고 공용 폴더에만 복사합니다. 즉, 최종 도커 이미지에는 완성된 빌드 사이트와 해당 파일을 제공하기 위한 베어 minimun nginx만 포함됩니다.