Previously, I posted a question regarding this issue: Uncaught TypeError: THREE.MTLLoader is not a constructor
I was able to resolve it by modifying the three-mtl-loader file. However, since I plan to upload my work to GitHub later, I need to find a solution that doesn't involve altering these files.
Instead, I'm attempting to load the obj and mtl files using loaders from the classic example found here: https://github.com/mrdoob/three.js/blob/master/examples/webgl_loader_obj_mtl.html
Despite my efforts, I still encounter the error 'Uncaught TypeError: THREE.MTLLoader is not a constructor'
I'm a bit uncertain about how to correctly implement these loaders, but my current code snippet looks like this:
import * as THREE from 'three'
import {OBJLoader} from 'three'
import {MTLLoader} from 'three'
var mtlLoader = new THREE.MTLLoader();
mtlLoader.load("http://blabla.obj.mtl", function(materials) {
materials.preload();
var objLoader = new THREE.OBJLoader();
objLoader.setMaterials(materials);
objLoader.load("http://blabla.obj", function(object) {
object.scale.x = scale;
object.scale.y = scale;
object.scale.z = scale;
scene.add(object)
});
});
In the three.js file located in the src folder, I have added:
export { OBJLoader } from './loaders/OBJLoader.js'
export { MTLLoader} from './loaders/MTLLoader.js'
EDIT
After installing via NPM, the initial error disappeared. However, new issues have surfaced - which I have addressed in a separate question: three-mtl-loader error: THREE.MeshPhongMaterial: .shading has been removed -> object not visible