I’m running into a strange issue with react-three-fiber that only shows up in development, but not after deploying to Vercel.

Here’s my setup:

  
    
    
    
    {countries && }
  

  
  

I pass the mesh ref into another component and use it inside useFrame:

function Abc({ globeRef }) {
  useFrame((state, delta) => {
    if (globeRef) {
      console.log("Hello:", delta)
      console.log(globeRef)
    }
  })
  return null
}

Even though I’m just logging the ref, I get this error in development:

Uncaught TypeError: Cannot convert undefined or null to object
at three.core.js:14737

What’s confusing is:

• It only happens in development
• It never happens in production
• If I remove these two lines, the error goes away in dev:

{countries && }

I don’t understand why these components affect the ref or why this issue only exists in development.