Add a Dockerfile that generates an image suited for production about storefront HOT 5 CLOSED

# Step 1. Rebuild the source code only when needed
FROM node:18-alpine AS builder

RUN npm install -g pnpm

WORKDIR /app

# Copy lock files if file exists
COPY ./frontend/package.json ./frontend/pnpm-lock.yaml ./

# Omit --production flag for TypeScript devDependencies
RUN pnpm install

COPY ./frontend/ ./

# Run eslint
RUN pnpm run lint

# Environment variables must be present at build time
# https://github.com/vercel/next.js/discussions/14030
ARG API_URI
ENV API_URI ${API_URI:-http://localhost:8000/graphql/}

# Uncomment the following line to disable telemetry at build time
# ENV NEXT_TELEMETRY_DISABLED 1

# Build app
RUN pnpm run build

# Step 2. Production image, copy all the files and run next
FROM node:18-alpine AS runner

WORKDIR /app

# Don't run production as root
RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs

# My custom start and entrypoint files
COPY ./compose/production/frontend/start /start
RUN sed -i 's/\r$//g' /start
RUN chmod +x /start

COPY ./compose/production/frontend/entrypoint /entrypoint
RUN sed -i 's/\r$//g' /entrypoint
RUN chmod +x /entrypoint

# USER nextjs

# COPY --from=builder /app/public ./public
# COPY --from=builder /app/next.config.js .
# COPY --from=builder /app/package.json .
COPY --from=builder /app ./

# Automatically leverage output traces to reduce image size
# https://nextjs.org/docs/advanced-features/output-file-tracing
# COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static

# Environment variables must be redefined at run time
# ARG ENV_VARIABLE
# ENV ENV_VARIABLE=${ENV_VARIABLE}
# ARG NEXT_PUBLIC_ENV_VARIABLE
# ENV NEXT_PUBLIC_ENV_VARIABLE=${NEXT_PUBLIC_ENV_VARIABLE}
ARG API_URI
# -> the backend app
ENV API_URI ${API_URI:-http://localhost:8000/graphql/}

ENV NEXT_PUBLIC_STOREFRONT_NAME="Your app name"

ARG NEXT_PUBLIC_API_URI
ENV NEXT_PUBLIC_API_URI=${NEXT_PUBLIC_API_URI:-https://vercel.saleor.cloud/graphql/}

ARG NEXT_PUBLIC_API_URI_INSECURE
ENV NEXT_PUBLIC_API_URI_INSECURE=${NEXT_PUBLIC_API_URI_INSECURE:-http://vercel.saleor.cloud/graphql/}

ENV NEXT_PUBLIC_DEFAULT_CHANNEL=default-channel
ENV NEXT_PUBLIC_HOMEPAGE_MENU=navbar
# -> the frontend app
ENV NEXT_PUBLIC_VERCEL_URL=https://localhost:3001
ENV NEXT_PUBLIC_DEMO_MODE=false
ENV NEXT_PUBLIC_GEOLOCATION=false
ENV NEXT_PUBLIC_ALLOWED_IMAGE_DOMAINS=img.youtube.com,i.ytimg.com,s3.amazonaws.com
ENV NEXT_PUBLIC_IMAGE_CONVERSION_FORMATS=image/avif,image/webp
ENV NEXT_PUBLIC_CHECKOUT_URL=

# Uncomment the following line to disable telemetry at run time
# ENV NEXT_TELEMETRY_DISABLED 1

# ENTRYPOINT ["/entrypoint"]
CMD ["node_modules/.bin/next", "start"]