search

pmndrs / react-three-next

React Three Fiber, Threejs, Nextjs starter
https://react-three-next.vercel.app/
MIT License
2.52k stars 342 forks source link

Issue With .glb File load on Vercel Deployment #110

Closed gene-ius closed 1 year ago

gene-ius commented 1 year ago

Hello there!

I'm coming across an issue when deploying my site where the .glb files that I have stored in my public folder are throwing Errors on their load. It's a strange error because my page renders with imported models on my local device but not on my deployed Vercel site. I am using useGLTF from @react-three.drei to load the nodes and materials of the .glb files, which create the mesh object. Also, I use Git LFS to store these large .glb files in my personal repo which is deployed to Vercel.

For my specific use case, I cannot use a full GLTF to JSX conversion of the file because I have a list of models stored in my public folder that I want the user to be able to iterate through, viewing each model one by one via a "NEXT" button and global state management. I also have multiple model versions functionality that a user can look through for each .glb file which is implemented through local state and a change of the displayed mesh - executed by clicking the mesh object.

My console currently throws this error that I am pasting below. Does anyone know a workaround for this? I'm currently blocked from further dev by this issue. Thanks for any advice at all! If code snippets are also useful in diagnosing this issue, please let me know and I will send them as well :)

CONSOLE ERROR:

Screen Shot 2022-12-28 at 11 04 22 PM
gene-ius commented 1 year ago

Found the fix to this, it looks like the Vercel build was not aware of the Git LFS packages and was attempting to load a pointer to my .glb files. Went to Vercel Support for this and I was unblocked.