Search code examples
node.jsreactjsexpressnext.jsnestjs

Build NextJS as a Static Site and serve it in monolithic backend (node Express or NestJS)

I have a simple project built in:

  • Node v16.14
  • Express
  • Nextjs v13.2

I want to serve the output generated from Nextjs Static HTML Export in NestJS with Serve Static or in Express.

The output from my Nextjs build doesn't include an index.html file or similar.

How can I implement a monolithic server that handles the API requests and also serves my web UI SPA?

I also tried the instruction from Nextjs' docs and from the answer from Mohssine Oussama. Here's the output I got after running next build && next export with the output: 'export' option enabled at next.config.js

nextjs output

Solution

  • The problem was caused by not having configured an Image Optimization Strategy, and this is required when you're generating a Static Site in Nextjs.

    There error message logging from NextJS is a bit cryptic. But this issue can be fixed by disabling image optimization in next.config.js

    This is how my next config file looks right now:

    const nextConfig = {
  reactStrictMode: true,
  images: {
    unoptimized: true
  }
}

module.exports = nextConfig