CODEWITHSUNDEEP
dockernext.jssharp
miko866
miko866

Reputation: 299

How run next.js with node-sharp for docker

I have a problem implementing sharp for Dockerfile.

Error: 'sharp' is required to be installed in standalone mode for the image 
optimization to function correctly

Next.js with sharp works fine for local developing:

next.config.js

module.exports = {
  experimental: {
    outputStandalone: true,
  },

}

Dockerfile:

FROM node:16-alpine AS deps
# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
RUN apk add --no-cache libc6-compat

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

# Rebuild the source code only when needed
FROM node:16-alpine AS builder
WORKDIR /app
COPY --from=deps /app/node_modules ./node_modules
COPY . .

# Next.js collects completely anonymous telemetry data about general usage.
# Learn more here: https://nextjs.org/telemetry
# Uncomment the following line in case you want to disable telemetry during the build.
# ENV NEXT_TELEMETRY_DISABLED 1

RUN npm run build

# Production image, copy all the files and run next
FROM node:16-alpine AS runner
WORKDIR /app

ENV NODE_ENV production
# Uncomment the following line in case you want to disable telemetry during runtime.
# ENV NEXT_TELEMETRY_DISABLED 1

RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs

# You only need to copy next.config.js if you are NOT using the default configuration
COPY --from=builder /app/public ./public
COPY --from=builder /app/package.json ./package.json
COPY --from=builder /app/package.json ./package.json
COPY --from=builder /app/next.config.js ./
COPY --from=builder /app/next-i18next.config.js ./
COPY --from=builder /app/next-sitemap.js ./cd
COPY --from=builder /app/jsconfig.json ./jsconfig.json
COPY --from=builder /app/data/ ./data
COPY --from=builder /app/components/ ./components
COPY --from=builder /app/utils/ ./utils
COPY --from=builder /app/assets/ ./assets

# 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

USER nextjs

EXPOSE 3000

ENV PORT 3000

CMD ["node", "server.js"]

.env file:

NEXT_SHARP_PATH=/tmp/node_modules/sharp next start

Sharp is installed in package.json

I checked both Next/Vercel tuts:

RUN Docker:

docker build --no-cache . -t website-app && docker run --name website -p 3000:3000 website-app

Upvotes: 7

Views: 10990

Answers (7)

deadcoder0904
deadcoder0904

Reputation: 8683

if you are using pnpm, you need only 2 steps:

  1. put this in your package.json:
    "pnpm": {
        "supportedArchitectures": {
            "os": [
                "current"
            ],
            "cpu": [
                "x64",
                "arm64"
            ]
        }
    }
  1. install sharp normally
RUN pnpm install --frozen-lockfile --prefer-offline
RUN pnpm install [email protected]

don't forget to remove sharp from your package.json. you also don't need ENV_SHARP_PATH either.

if this is not working, then do rm -rf node_modules && pnpm install & it will work.

My full dockerfile example is here.

This discussion on Next.js Github has different solutions.

Next.js doc has a simple guide on it here.

Sharp also recommends this here.

Upvotes: 0

Asep Rudi L.H
Asep Rudi L.H

Reputation: 1

I solved with added several command in dockerfile :

  1. add "RUN npm i sharp" in deps section
  2. add "COPY --from=deps /root/.npm /root/.npm" in builder section before RUN npm run build
  3. add "ENV NEXT_SHARP_PATH=/app/node_modules/sharp" in runner section

also if you use same image for deps, builder, and runner. I just add "RUN npm i sharp" in runner section to solved this.

Upvotes: 0

Nhui
Nhui

Reputation: 11

If you want to install sharp on alpine image, you need to rebuild it after the first install.

npm install --save sharp
npm rebuild --arch=x64 --platform=linux --libc=musl sharp

which can be written as Dockerfile as follows

FROM node:18-alpine

RUN apk add --no-cache libc6-compat
WORKDIR /app

COPY . .

RUN npm install && \
    npm rebuild --arch=x64 --platform=linux --libc=musl sharp

RUN npm run build

...

P.S. If you do the above, you won't need to set NEXT_SHARP_PATH environment variable.

Upvotes: 1

FluxCapacitor
FluxCapacitor

Reputation: 86

For the final step (the one labeled "runner") in your Dockerfile, replace the base image with node:16-slim. This image is Debian-based, so it is approximately 20 MB larger than the alpine variant, but it has the binaries required to run sharp.

When using a similar Dockerfile to yours, I found that the NEXT_SHARP_PATH environment variable was not needed when using a Debian-based Node image.

And for reference, here is the NextJS documentation about the error message: https://nextjs.org/docs/messages/sharp-missing-in-production

Update: You may also be able to specify the libc implementation found in your base Docker image by using the following flags:

RUN npm_config_platform=linux npm_config_arch=x64 npm_config_libc=glibc npm ci

For more information about what these flags are, see the documentation for sharp.

Upvotes: 5

Sunil Sapkota
Sunil Sapkota

Reputation: 1220

npm i sharp

this fix the problem for me

Upvotes: 2

Seban
Seban

Reputation: 161

What works for me, is to change the version of Alpine Linux in the Dockerfile: FROM node:18-alpine AS deps (instead of node:16)

Adding or removing node-sharp in my .env file didn't work for me.

Upvotes: 0

miko866
miko866

Reputation: 299

I figured it out.

I removed NEXT_SHARP_PATH=/tmp/node_modules/sharp next start from .env Local docker doesn't work with node-sharp without NEXT_SHARP_PATH and that is weird.

But I deployed it in my K8s Cluster with Docker and it works as is expected.

Upvotes: 0

Related Questions