useFrame doesn't work, it throws 'g is not a function' error crashing the component which uses it

[abnud1]

I'm currently using create-react-app and doing simple simulation of a table and paper, here is my code:

return (
    <Canvas camera={{ position: [0, 0, 50] }}>
      <directionalLight intensity={1} position={[1000, 1000, 1000]} />
      <mesh position={[15, 0, 10]}>
        <planeBufferGeometry args={[20, 20]} />
        <meshBasicMaterial color="white"></meshBasicMaterial>
      </mesh>
      <mesh position={[tablePosition.x, tablePosition.y, tablePosition.z]}>
        <planeBufferGeometry args={[100, 50]} />
        <meshBasicMaterial map={woodMap}></meshBasicMaterial>
      </mesh>
    </Canvas>
  );

Now I want to do some physics which is why I need to use useFrame to step the World, unfortunately even useFrame(() => {}) throws "g is not a function" error, yup even when passing empty callback to it it throws the error.

I don't know what is this "g"

threejs version: 120
react-three-fiber version: 5.0.1
create-react-app version: 3.4.3
react version: 16.13.1

[drcmda]

your canvas does not contain a component that would be able to throw that warning. i take it you're calling useFrame outside, and that's not permitted: https://github.com/pmndrs/react-three-fiber/blob/master/api.md#hooks