How to load gltf modules in React using GLTFLoader?

Hello guys.
I’m using Threejs with Reactjs.
I made my scene and my camera.
I want to load 3d modules with GLTF format with GLTFLoader().
I imported GLTFLoader from three/examples/jsm/loaders/GLTFLoader. like this:
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';

Now I want to load my 3d file.
Where I have to put my files in my project? public folder?
How to address it?
Can anybody help me?

Yes, that should be the right place. Also see: Unable to Download GLB file with GLTFLoader

You do it like so (assuming the asset is in the public folder):

const loader = new GLTFLoader();
loader.load( './myModel.glb', gltf => {

 scene.add( gltf.scene );

} );
1 Like