Standalone build for monorepos

[pstoica]

I know this has been brought up a few times, but I ran into some weird issues with the standalone build feature in a monorepo.

I couldn't get it to work without a few changes. My app package is called dashboard here. I'm using Yarn v1 workspaces.

  experimental: {
    outputStandalone: true,
    outputFileTracingRoot: path.join(__dirname, "../../"),
  },

# Automatically leverage output traces to reduce image size 
# https://nextjs.org/docs/advanced-features/output-file-tracing
COPY --chown=nextjs:nodejs /packages/dashboard/.next/standalone ./
COPY --chown=nextjs:nodejs /packages/dashboard/.next/static ./packages/dashboard/.next/static
COPY /packages/dashboard/public ./packages/dashboard/public
# These are partially installed for some reason. Remove or it won't work.
RUN rm -rf ./packages/dashboard/node_modules/react
RUN rm -rf ./packages/dashboard/node_modules/next

...

CMD ["node", "./packages/dashboard/server.js"]

Basically, I had to move everything into the standalone/packages/dashboard directory, and use the server.js there.

If I tried to move server.js to root, it said it couldn't find a production next build.
If I didn't move the static files into the packages, I was getting 404s for every chunk.
For some reason I had partially built dependencies in the packages directory that I had to remove. I should probably move these to the root package.json, but I'm not sure if this was something else.

So yeah, this was weird. Am I missing something? Is this something solvable in documentation or directly in next.js?

[DanielBailey-web]

I have this same error, did you find a fix?

[mattvb91]

Has anyone managed to make this work?

[umairb-pedal]

This is still a problem! I am getting stupid standalone outputs which is a pain to manage.

[awkaiser-tr]

Been a few months since last bump, and I can report that this continues to be a problem on 13.5.3

[Flavien-Pensato]

I get an error in the same case:

• build on standalone
• monorepo setup

My error is once I navigate in my browser

[kadencartwright]

this happened to me as well a while back. My front end was requesting a script at an incorrect url (in my case a proxy was decoding a urlencoded value in the url) and it was returning my apps 404 error instead of the js file

[Flavien-Pensato]

In fact, I resolved my issue. It was just me who copy to the wrong directory the static folder. I can help if want

[sangbooom]

@Flavien-Pensato We are providing a static file in ./public/_next/static, and the same problem occurs. What's the problem? Please help me

[Flavien-Pensato]

@Flavien-Pensato We are providing a static file in ./public/_next/static, and the same problem occurs. What's the problem? Please help me

I can provide the command line if you show me your monorepo structure and gave me the build folder (by default .next)

[jezsung]

The problem is in a monorepo setup, Next.js produces a node_modules folder in the root directory and in the /.next/standalone directory.

If you COPY files normally like this:

COPY --chown=nextjs:nodejs /packages/dashboard/.next/standalone ./
COPY --chown=nextjs:nodejs /packages/dashboard/.next/static ./packages/dashboard/.next/static
COPY /packages/dashboard/public ./packages/dashboard/public

The root node_modules folder will be missing so that a missing next packages error occurs.

The possible workaround for this is to change the Dockerfile commands in a way that includes the root node_modules folder and you would copy the other files inside the root .next folder.

The final folder structure should be:

/.next
  /standalone
    /packages
      /dashboard
        /.next
        /public
        package.json
        server.js
  /node_modules
  package.json
/node_modules   <-- you're missing this one
package.json

This workaround is cumbersome and feels hacky. This goes against the idea of the "standalone" directory which can be deployed as is. I think Next.js has to produce the same output as it would in a non-monorepo setup.

[jonstelly]

In case it helps anyone, here's a dockerfile for a turbo monorepo using the "single dockerfile in the root of the repo" guidance.

• web is a nextjs web app
• worker is a bog-standard webpacked nodejs app
• my-sdk is an ubuntu docker image with my dev tools pre-installed
• my-node is the node base image + doppler
• the special dotenv copy and the launch.js and package.*.json are just for calling doppler to configure the environment and launch server.js

the redundant apps/web/apps/web is a minor cosmetic annoyance but I'm not losing sleep over it.
thanks to @pstoica for posting this, I was having trouble figuring out where to copy public and static content.

ARG TARGETPLATFORM
FROM my-sdk:dev AS build
COPY ./ /my-app
WORKDIR /my-app
RUN bun install --frozen-lockfile && \
    bun prisma:generate && \
    bun run build

FROM my-node:dev AS web
COPY --from=build /my-app/apps/web/.next/standalone /my-app/apps/web
COPY --from=build /my-app/apps/web/public /my-app/apps/web/apps/web/public
COPY --from=build /my-app/apps/web/.next/static /my-app/apps/web/apps/web/.next/static
COPY --from=build /my-app/node_modules/dotenv /my-app/apps/web/node_modules/dotenv
COPY --from=build /my-app/scripts/launch.js /my-app/apps/web
COPY --from=build /my-app/scripts/package.web.json /my-app/apps/web/package.json
WORKDIR /my-app/apps/web
EXPOSE 3000
CMD ["node", "launch.js"]

FROM my-node:dev AS worker
COPY --from=build /my-app/node_modules/dotenv /my-app/apps/worker/node_modules/dotenv
COPY --from=build /my-app/apps/worker/dist /my-app/apps/worker
COPY --from=build /my-app/scripts/launch.js /my-app/apps/worker
COPY --from=build /my-app/scripts/package.worker.json /my-app/apps/worker/package.json
WORKDIR /my-app/apps/worker
CMD ["node", "launch.js"]

[ghost]

(just commenting to link this discussion with issue #56823)

[nx-alejandrolacasa]

I see there are 2 discussions in this thread, and the original one remains unanswered.

I am facing the same issue, having "partially installed" dependencies in the root node_modules that will break the application on run time.

In my case, the package creating the issue is next-intl, but what's even weirder, it only happens for certain versions, and after comparing the code changes between them, I cannot see any indication of why this is happening.

So, as a recap, when building the application with standalone: true in a monorepo, some dependencies are installed in .next/standalone/node_modules, outside of the next app package folder, which break the application:

I hope this thread does not remain dead for another 2 years...

[nx-alejandrolacasa]

Well, I've found the solution to the issue myself, which might be helpful for you all here. It all boils down to how the dependency is "registered" in the package-lock.json.

When the dependency is registered as an "exclusive" dependency of the site package in my case, everything functions correctly. The next standalone + turbo combo resolves it perfectly and places the package in standalone/apps/site/node_modules where it should be:

"apps/site/node_modules/next-intl": {
      "version": "3.5.1",
      ...
    },

However, when this dependency is shared with another package, for example, another app that runs Storybook in the same monorepo, the dependency is placed at the root level, as it is common to both packages.

"node_modules/next-intl": {
      "version": "3.5.1",
      ...
    },

In such a scenario, next standalone + turbo will place the package in standalone/node_modules and attempt to extract from the dependencies of that package everything required for it to function. In my case, this involved some components from next. The issue arose during this extraction of dependencies, as it failed to correctly identify them, causing the app to crash at build time.

Ultimately, to resolve the issue, I kept the dependency in site alone and exported it from there to the other package, allowing it to be used there without being a direct dependency:

/* apps/site/libs/next-intl/index.ts */
export * from 'next-intl'

/* apps/storybook/.storybook/preview.tsx */
import { NextIntlClientProvider } from '@site/libs/next-intl'

While not the most elegant solution, it works sufficiently well for me. I hope I've managed to explain myself clearly and that this helps others.

[zacksleo]

COPY .next/static ./packages/apps/website/.next/static like this fixed my issed.
Just copy .next/static files to standalone/packages/apps/website/.next/static directory

[abcdefghiraj]

Hope this helps someone.
For my monorepo setup, I tried copying the standalone build to docker and that was working, whereas when I was trying to directly copy the build output to a folder (with cp), zip it and then extract it elsewhere on my machine, I kept getting errors for some missing packages (cannot find styled-jsx).
What I figured out (and is related to what @nx-alejandrolacasa says above) is that the nested node modules have symlinks and the way to go by was to preserve them. So copying with cp -P and zipping with zip -y worked in my case. I am on next 14.2.4.

[rishi23root]

i was working with the turbo repo with standalone next app, i got it working👍

# Base stage with Alpine image
FROM node:20-alpine3.17 AS base
WORKDIR /app

# # # Install necessary packages
RUN apk update && apk add --no-cache libc6-compat openssh git

# # # Install pnpm and turbo globally define you specific version according to the package.json
RUN npm install -g [email protected] turbo  
RUN pnpm config set store-dir ~/.pnpm-store

# # #############################################################
# # # Stage 1 - Pruning unnecessary files                       #
# # #############################################################

FROM base AS pruner

# Copy all files to the container and Prune files that are not needed for the specified project
COPY . .
RUN npx turbo prune --scope=web --docker

# # #############################################################
# # # Stage 2 - Installing dependencies and building            #
# # #############################################################

FROM base AS builder
WORKDIR /app
# # Copy lockfile and package.json's of isolated subworkspace
COPY --from=pruner /app/out/pnpm-lock.yaml ./pnpm-lock.yaml
COPY --from=pruner /app/out/pnpm-workspace.yaml ./pnpm-workspace.yaml
COPY --from=pruner /app/out/json/ .

# Install dependencies using pnpm, using a cache for faster builds
RUN --mount=type=cache,id=pnpm-store,target=~/.pnpm-store pnpm install --frozen-lockfile

# # Copy source code of isolated subworkspace
COPY --from=pruner /app/out/full/ .
RUN turbo build --filter=web
RUN pnpm prune --prod --no-optional

# # Cleanup: Remove source files that are not needed
RUN rm -rf ./**/*/src
RUN rm -rf apps/web/.next/standalone/node_modules


# # #############################################################
# # # Stage 3 - Run the application                             #
# # #############################################################

FROM base AS runner

WORKDIR /app/

ENV NODE_ENV="production"

# Copy built files from the builder stage
# COPY --from=builder /app/node_modules ./node_modules
COPY --from=builder /app/ .     

COPY apps/web/public apps/web/.next/standalone/public
RUN mkdir -p apps/web/.next/standalone/public/_next/static
RUN cp -r apps/web/.next/static/* apps/web/.next/standalone/public/_next/static

CMD node apps/web/.next/standalone/server.js

[Jdruwe]

I wonder if there is a better wat for NX nowadays, anyone have an idea?

[SunStupic]

My working dockerfile for nx monorepo:

The key is to copy public and .next/static into the dist/apps/steps folder instead of apps/steps folder.

FROM node:20-alpine AS base

# Install dependencies only when needed
FROM base 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

# Install dependencies based on the preferred package manager
COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./
ENV CYPRESS_INSTALL_BINARY=0
RUN corepack enable pnpm && pnpm i --frozen-lockfile

# Rebuild the source code only when needed
FROM base 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 npx nx run steps:build

# Production image, copy all the files and run next
FROM base 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


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

USER nextjs

EXPOSE 3000

ENV PORT=3000

# server.js is created by next build from the standalone output
# https://nextjs.org/docs/pages/api-reference/next-config-js/output
ENV HOSTNAME="0.0.0.0"

CMD ["node", "apps/steps/server.js"]

[ihtesham7]

In my case the images in the public folder were not rendered and throwing 404 error. I had to remove the dist from the front like this:

COPY --from=builder --chown=nextjs:nodejs /app/dist/apps/steps/public ./apps/steps/public

[iwasrobbed]

Adding more confusion & breadcrumbs to the mix... on Next 14.2.25 having to also symlink to node_modules otherwise you get a bunch of MODULE NOT FOUND errors that we didn't get on prior versions 🤷

COPY --from=builder --link --chown=nextjs:nodejs /app/node_modules ./node_modules

where the --link preserves existing symlinks upon copy

[zeekrey]

I didn’t dig too deep into that issue, but from what I can see, it looks like the problem is tied to where the lock file is and what’s in it. In a monorepo, if there’s a lock file in the package, the standalone output goes right under standalone. But ideally, the lock file should be at the root of the monorepo, which means the standalone folder will have subfolders like /app/docs.

Most of the time, I fixed this by deleting some lock files that were probably misplaced in the packages.

[WangLarry]

in next.config.ts, add:

outputFileTracingRoot: __dirname,