To be honest, I am a newbie to Nuxt 3, so, any comments are welcome.
Last week (2022/08/30), I noticed that my members are using Nuxt 3 and the bundle size was tremendous. Therefore, I want to reduce the size by using the multi-stage method and using node:alpine.
Spoiler: You can check out the result below by size before (2.88GB) and after (131MB).
REPOSITORY TAG IMAGE ID CREATED SIZE
myapp v1.0.2 5ffd6627a861 12 seconds ago 131MB
myapp v1.0.1 ef13e87402c4 20 hours ago 2.88GB
WARN: You need to make sure that your app is compatible with node:alpine.
The Dockerfile:
FROM node:16.17.0 AS base
#### multi-stage: builder
FROM base AS builder
RUN mkdir -p /src
COPY . /src
WORKDIR /src
# config/.env should be mounted or replace with config/.env.example
RUN ["cp", "/src/config/.env.example", "/src/config/.env"]
RUN yarn install
RUN yarn build
#### multi-stage: runner
FROM node:16.17.0-alpine3.16
WORKDIR /app
COPY --from=builder /src/.output /app/.output
COPY --from=builder /src/nuxt.config.ts /app/
COPY --from=builder /src/public /app/
COPY --from=builder /src/config /app/
COPY --from=builder /src/.env /app/
EXPOSE 3000
CMD source .env ; node /app/.output/server/index.mjs