Switch the pre-rendering method in a JSS Next.js app

Current version: 19.x

You can choose the initial pre-rendering form when creating the JSS Next.js app with the optional prerender parameter. If you omit the parameter, the application is optimized for static site generation (SSG) by default. For example:

jss create my-first-jss-app nextjs --prerender {SSG|SSR}

The JSS Next.js application comes with an optional catch-all route defined in <src>/pages/[[..path]].tsx. The route can be optimized for either static site generation (SSG) or server-side rendering (SSR).

The route file is created, based on the value you provide for the --prerender parameter with the functionality for fetching data for SSR or fetching data for SSG.

After creating the application, you may wish to switch the pre-rendering form or use both types of data fetching for hybrid rendering.

To switch the JSS Next.js application from SSG to SSR:

  1. Move or delete <src>/pages/[[..path]].tsx.

  2. Download the file [[..path]].SSR.tsx to <src>/pages/ and rename it to [[..path]].tsx.

  3. Optionally, delete /<src>/lib/sitemap-fetcher.ts.

To switch the JSS Next.js application from SSR to SSG:

  1. Move or delete the file <src>/pages/[[..path]].tsx.

  2. Download [[..path]].tsx to the folder <src>/pages.

  3. Download sitemap-fetcher.ts to <src>/lib.

Do you have some feedback for us?

If you have suggestions for improving this article,