Hi,
I’m trying to load a gltf file by the three module, but I can’t import GLTFLoader from three.
I installed the three module by npm on my react app and here is the snippet:
this.gltfLoader = new THREE.GLTFLoader();
this.gltfLoader.load(
“…/…/assets/Bee.glb”,
(gltf) => {
scene.add(gltf.scene);
},
null,
(error) => {
console.log(error);
}
);
When I run my app, It says there is no GLTFLoader in THREE package
also I tried to load it by this command: import {GLTFLoader} from 'three/examples/jsm/loaders/GLTFLoader'
but there is no jsm folder in the module folder in node_modules
I don’t think this is true. Keep in mind that when importing GLTFLoader via ES6 import, you have to remove the THREE namespace when creating the loader. So it should be:
This path doesn’t exist.
there is no jsm folder in my examples folder in node_modules,
only fonts, and js folder
Failed to compile.
./src/components/DemoScene/scene.js
Module not found: Can’t resolve ‘three/examples/jsm/loaders/GLTFLoader.js’ in ‘F:\Temp\src\components\DemoScene’
For future Googlers: I was also having this problem.
Why? The node_modules/three/examples folder was missing because the template repository I was using contained a .yarnclean. When this file is included, it automatically enables Yarn’s autoclean functionality, which reduces the size of the node_modules folder by deleting files/directories listed in .yarnclean. In my case, the .yarnclean file looked like this:
# examples
example
examples
...
So, if your repository contains a .yarnclean file, make sure that it doesn’t contain examples as one of the directories to delete.