how to use react portal with tanstack start?

Hello, as the title says.
I got this error :

react-dom-client.development.js:10996  Uncaught Error: Switched to client rendering because the server rendering errored:
document is not defined

react-dom-client.development.js:10996  Uncaught Error: Switched to client rendering because the server rendering errored:
document is not defined

I've try this : https://tanstack.com/router/v1/docs/framework/react/api/router/clientOnlyComponent, but no luck.
this is my code :

<ClientOnly fallback={<div>test</div>}>
        {createPortal(
          <div className="fixed top-0 left-0 h-full w-full bg-white opacity-30 backdrop-blur-md"></div>,
          document.body,
        )}
      </ClientOnly>

<ClientOnly fallback={<div>test</div>}>
        {createPortal(
          <div className="fixed top-0 left-0 h-full w-full bg-white opacity-30 backdrop-blur-md"></div>,
          document.body,
        )}
      </ClientOnly>

React | TanStack Router React Docs

TanStack•4w ago•

6 replies

slow-yellow

how to use react portal with tanstack start?

Hello, as the title says.
I got this error :

react-dom-client.development.js:10996  Uncaught Error: Switched to client rendering because the server rendering errored:
document is not defined

react-dom-client.development.js:10996  Uncaught Error: Switched to client rendering because the server rendering errored:
document is not defined

I've try this : https://tanstack.com/router/v1/docs/framework/react/api/router/clientOnlyComponent, but no luck.
this is my code :

<ClientOnly fallback={<div>test</div>}>
        {createPortal(
          <div className="fixed top-0 left-0 h-full w-full bg-white opacity-30 backdrop-blur-md"></div>,
          document.body,
        )}
      </ClientOnly>

<ClientOnly fallback={<div>test</div>}>
        {createPortal(
          <div className="fixed top-0 left-0 h-full w-full bg-white opacity-30 backdrop-blur-md"></div>,
          document.body,
        )}
      </ClientOnly>

React | TanStack Router React Docs

how to use react portal with tanstack start?

Similar Threads

how to use react portal with tanstack start?

Similar Threads

Similar Threads

Similar Threads