Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings
This repository was archived by the owner on Jul 6, 2025. It is now read-only.
Discussion options

I'm trying to use @react-three/fiber in my Aleph project.
The @react-three/fiber Canvas element depends on react-spring, which in turn depends on ResizeObserver, which the deno SSR environment doesn't support.

I wrapped my Canvas in a Suspense, which solves the problem functionally, but errors are still being thrown.
I wasn't able to find anything about client-side rendering in the docs.

import { Suspense } from "react";
import { Canvas } from "@react-three/fiber";

export default function Index() {
  return (
    <div className="absolute w-full h-full">
      <Suspense fallback={<></>}>
        <Canvas>
          <ambientLight intensity={0.5} />
          <mesh>
            <boxGeometry args={[1, 1, 1]} />
            <meshStandardMaterial color="red" />
          </mesh>
        </Canvas>
      </Suspense>
    </div>
  );
}

What's the recommended way of forcing a component or fragment to render client-side only?

You must be logged in to vote

Replies: 0 comments

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Category
🙏
Q&A
Labels
None yet
1 participant
Morty Proxy This is a proxified and sanitized view of the page, visit original site.