pmndrs / gltfjsx

🎮 Turns GLTFs into JSX components
https://gltf.pmnd.rs
MIT License
4.71k stars 310 forks source link

Invalid hook call #104

Closed dattran1999 closed 3 years ago

dattran1999 commented 3 years ago

Hi, for some reason, I keep getting this error when I run the program npx gltfjsx scene_draco.glb. The glb file is from this repo at example/public/scene_draco.glb.

  ERROR Objects are not valid as a React child (found: Error: Invalid hook call. Hooks can only be
       called inside of the body of a function component. This could happen for one of the
       following reasons:
       1. You might have mismatching versions of React and the renderer (such as React DOM)
       2. You might be breaking the Rules of Hooks
       3. You might have more than one copy of React in the same app
       See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this
       problem.). If you meant to render a collection of children, use an array instead.
           in ink-text (created by Text)
           in Text
           in ink-box (created by Box)
           in Box
           in App
           in App
           in InternalApp

Additional info: is it potentially caused by this error when I install the program via npx? When I run npx gltfjsx only, I get the warning below. Also it looks like quite similar to this issue https://github.com/pmndrs/gltfjsx/issues/93

npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: react-dom@17.0.2
npm WARN Found: react@16.14.0
npm WARN node_modules/react
npm WARN   peer react@"^16.8.0  || ^17.0.0" from @react-spring/core@9.2.4
npm WARN   node_modules/@react-spring/core
npm WARN     @react-spring/core@"^9.2.4" from gltfjsx@4.3.4
npm WARN     node_modules/gltfjsx
npm WARN     1 more (@react-spring/web)
npm WARN   6 more (@react-spring/web, ink, use-error-boundary, ...)
npm WARN 
npm WARN Could not resolve dependency:
npm WARN peer react@"17.0.2" from react-dom@17.0.2
npm WARN node_modules/react-dom
npm WARN   peer react-dom@"^16.8.0  || ^17.0.0" from @react-spring/web@9.2.4
npm WARN   node_modules/@react-spring/web
npm WARN   1 more (use-error-boundary)
npm WARN 
npm WARN Conflicting peer dependency: react@17.0.2
npm WARN node_modules/react
npm WARN   peer react@"17.0.2" from react-dom@17.0.2
npm WARN   node_modules/react-dom
npm WARN     peer react-dom@"^16.8.0  || ^17.0.0" from @react-spring/web@9.2.4
npm WARN     node_modules/@react-spring/web
npm WARN     1 more (use-error-boundary)
npm WARN deprecated har-validator@5.1.5: this library is no longer supported
npm WARN deprecated uuid@3.4.0: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
drcmda commented 3 years ago

could you check if you have previously installed it and delete it from npm cache?

dattran1999 commented 3 years ago

I have removed the cache and reinstall it several times and it's still giving me the same warning whenever I install it again.

codingwithdidem commented 3 years ago

Same problem here => To solve this I had to install gltfjsx globally and then run it.

dattran1999 commented 3 years ago

ah that works for me. Thank you!