how to build nextjs with fallback: true enable

I'm unable to find any examples of what needs to be done to deploy nextjs with fallback: true enabled.

using export it throws an error that it can't be exported this way if fallback: true is enabled.

And if I use npm run build it doesn't seem to generate the out folder.

How can I run a build and generate the out folder with fallback: true enabled in my app

netlify.toml [build] command = "npm run build && npm run export" publish = "out"

package.json "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "export": "next export" },


Solution 1:

You can't use use npm run build to generate static 'out' folder (i.e. static html-files). Thats becouse with fallback enabled, your site became 'non-static'. So it can be deployed only on servers thats run NodeJS. You may start server with node start or implement your own NodeJS server. This is a most misunderstanding point about SSG\SSR. More info at https://nextjs.org/docs/advanced-features/static-html-export

Solution 2:

The other posts didn't explain why it doesn't work.

If you have fallback as true that means you have pages with dynamic routes (path/[pid].js) and you DON'T want to pre-render all the pages. You want some pages to load without data, maybe because you want to load data manually.

When you use NextJS's export, it creates a static app with no supporting backend so that the app can be served on a static host.

For each pre-rendered path, NextJS will generate a directory structure to match the prerendered path.

If you have: product/1, product/2, product/3 then NextJS will create those directories.

But if you have routes that are not prerendered like product/4 then NextJS will not create that directory, then when the user opens their browser to exmample.com/product/4 it will 404!