next.jsgraphqlapollo-client

NextJs Error at build: ApolloError: Dynamic server usage. Couldn't be rendered statically because it used revalidate: 0 fetch


When we build nextJs yarn build when it goes to the step Generating static pages we have this error:

Error occurred prerendering page "/partners/partner-with-us". Read more: https://nextjs.org/docs/messages/prerender-error
ApolloError: Dynamic server usage: Route /partners/partner-with-us couldn't be rendered statically because it used revalidate: 0 fetch http://localhost:4001 /partners/partner-with-us. See more info here: https://nextjs.org/docs/messages/dynamic-server-error

The page partner-with-us is super simple


const PartnerWithUs = () => {
  return <>test</>
}

export default PartnerWithUs

We are using Apollo Graphql for fetching data on other pages. We are using: https://github.com/apollographql/apollo-client-nextjs?tab=readme-ov-file#in-client-components-and-streaming-ssr

in the main layout we have

<ApolloWrapper>
  <main>{children}</main>
</ApolloWrapper>

Questions I am trying to solve to fix this issue:


Solution

  • My problem resulting in "revalidate: 0 fetch" error was that I was fetching data without caching enabled.

    const res = await fetch(`${this.baseUrl}/items/${entity}`, {
        method: 'GET',
        headers: this.getHeaders(),
        cache: 'force-cache', // cache on for static generation
        // cache: 'no-store', // cache off
    });
    

    My guess is that when no caching mechanism is assured, then SSR breaks, skipping the build step.

    Not sure how apollo client can be configured to enable caching, but I would try looking.