[FR] demonstrate Next.js example with output: "standalone"

[cschuet]

Thanks for putting together the Bazel Next.js example. Next.js support with Bazel is something I have been hoping for for a while.

I haven't found an easy way to deploy the generated artifacts on Vercel though, so I have been exploring open-next as an open-source alternative. Open-next requires building the next.js app though in "standalone" mode as far as I understand and that I have not been able to get to work with Bazel.

I updated the next.config.js to

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: "standalone",
  reactStrictMode: true,
  swcMinify: true,
  // https://nextjs.org/docs/messages/export-image-api
  images: {
    unoptimized: true,
  },
};

module.exports = nextConfig;

However when running bazel build //next.js:next the build fails with

Starting local Bazel server and connecting to it...
INFO: Analyzed target //next.js:next (194 packages loaded, 4178 targets configured).
ERROR: /home/chris/repos/examples/frontend/next.js/BUILD.bazel:21:5: Error while validating output TreeArtifact File:[[<execution_root>]bazel-out/k8-fastbuild/bin]next.js/.next : Failed to resolve relative path standalone/node_modules/is-even inside TreeArtifact /home/chris/.cache/bazel/_bazel_chris/6124436b433d4245c5b38797a7e77c15/execroot/_main/bazel-out/k8-fastbuild/bin/next.js/.next. The associated file is either missing or is an invalid symlink.
ERROR: /home/chris/repos/examples/frontend/next.js/BUILD.bazel:21:5: JsRunBinary next.js/.next failed: not all outputs were created or valid
Target //next.js:next failed to build
Use --verbose_failures to see the command lines of failed build steps.
INFO: Elapsed time: 10.898s, Critical Path: 6.68s
INFO: 29 processes: 4 internal, 1 linux-sandbox, 24 local.
ERROR: Build did NOT complete successfully

Can someone point me in the right direction here?

Has anyone found an alternative way to deploy the bazel generated artifacts to either Vecel, AWS or GCP?

Thanks,
Cheers

[alexeagle]

I've been working on this in a branch:
https://github.com/bazelbuild/examples/compare/nextjs_standalone

Some observations:

• next.js wants to copy node_modules from the working directory into the .next/standalone output directory.
• rules_js patches the Node.js runtime to make symlinks exiting the sandbox appear as regular files. patch_node_fs = False would stop that happening, but causes a different error, it appears in that branch
• We ought to be able to remove the dangling symlinks after next.js finishes running webpack. In that branch I have a workaround.js which tries to do that by hooking process.on('exit', ...) - however it's getting run many times, and seems to run too early, as webpack then errors that it can't find node_modules entries
• it seems like --sandbox_debug (and possibly --noincompatible_sandbox_hermetic_tmp) cause the output to be better-formed such that I was able to get the build action to succeed, and even run node server.js in the resulting output tree
• running outside of the sandbox might help.

[alexeagle]

Sorry I ran out of time to work on this, I had a short-term funding source for 30min of hand-on-help but we only scheduled two of those.

[alexeagle]

@gregmagolan has a solution for this now.

[gregmagolan]

We were able to get next start to work without needed standalone mode.

Would be good to get a proper example landed here in the future but for now here is a link to a delta with some comments on the changes: https://github.com/be9/bazelbuild-examples/pull/2/files

Since the example is bzlmod only we should probably fix the bzlmod toolchain issue first: aspect-build/rules_js#1530