r3f next.js starter: ReactDOMServer does not yet support Suspense.

[jamesryan-dev]

Edit 1: I am also using Styled-components so this might be the root of the issue which I'm in discussions with people who potentially resolved at here

---

Refactoring a next.js x r3f project to utilise the new starter in an attempt to optimise (so thankyou v much for this next starter!) however in my port I have run into this error:

Error: ReactDOMServer does not yet support Suspense.
    at ReactDOMServerRenderer.render

An example of the <Suspense> in use:

<CanvasDiv>
        <Suspense fallback={null}>
          <Canvas type={selectThreeDModel} />
        </Suspense>
      </CanvasDiv>

Canvas in use:

...
  return (
    <Canvas
      camera={{
        position: [
          setCameraPositonX(type),
          setCameraPositonY(type),
          setCameraPositonZ(type),
        ],
        near: 1,
        far: 15,
      }}
    >
      <ambientLight intensity={0.888} />
      <pointLight intensity={0.2} position={[0, 0, 1]} />

      <RenderModel type={type} />
    </Canvas>
  )
}

export default CanvasIntro

Any advice appreciated as not sure how to progress..

Thanks

[drcmda]

no idea about the next thing, in docusaurus i use their BrowserOnly component to solve it. the suspense around the canvas does nothing. canvas opens another react root, with another react renderer. the suspense has to be withing the canvas if you're waiting for a model to load.