Does Elements support Next.js/SSR? #2269

djMax · 2022-10-25T20:02:38Z

djMax
Oct 25, 2022

I'm getting an error about a hydration mismatch in Next.js (+Express).

Error: Hydration failed because the initial UI does not match what was rendered on the server.

And

Error: There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.

Is Elements meant to support SSR with Next.js? I tried wrapping it in a "client only" rendering component, but that didn't seem to work either.

kristianfreeman · 2022-12-05T17:49:10Z

kristianfreeman
Dec 5, 2022

I'm interested in this too. Is there anyone from the team who can comment on this?

0 replies

ismaelrumzan · 2023-01-05T16:46:08Z

ismaelrumzan
Jan 5, 2023

This is a sample code that worked for me in a Next.js app

export default function Home() {
  if (typeof window !== 'undefined') {
    return (
      <Layout home>
        <Head>
          <title>{siteTitle}</title>
        </Head>
        <div>
          <API apiDescriptionUrl={openapiurl} />
        </div>
      </Layout>
    );
  }
}

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Does Elements support Next.js/SSR? #2269

Uh oh!

{{title}}

Uh oh!

Replies: 2 comments

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

Does Elements support Next.js/SSR? #2269

Uh oh!

djMax Oct 25, 2022

Replies: 2 comments

Uh oh!

kristianfreeman Dec 5, 2022

Uh oh!

ismaelrumzan Jan 5, 2023

djMax
Oct 25, 2022

kristianfreeman
Dec 5, 2022

ismaelrumzan
Jan 5, 2023