How to fix “Uncaught ReferenceError: MouseInteract is not defined”?

When I try to merge multiple meshes, I cannot succeed to merge the materials of these meshes.

When I replace

let mesh = new THREE.Mesh(singleGeometry, materialArr);

by

let mesh = new THREE.Mesh(singleGeometry, new THREE.MeshPhongMaterial());

I get no error at all.

updateWorld() {
    let singleGeometry = new THREE.Geometry();
    let materialArr = [];
this.game.worlds.getWorld(OverWorld).world.forEach((block, pos) => {
    // console.log(this.renderRegister);
    // console.log(pos);
    // console.log(block.constructor.name);

    let modelClass = this.renderRegister.getRender(block.constructor.name);
    // console.log(modelClass);
    let model = new modelClass();

    //for(let i=0; i<model.parts.length; i++) {
    model.parts.forEach((part, i) => {
        //let part = model.parts[i];

        part.mesh.position.x = pos.x;
        part.mesh.position.y = pos.y;
        part.mesh.position.z = pos.z;
        //this.scene.add(part.mesh);

        part.mesh.updateMatrix(); // as needed
        singleGeometry.merge(part.mesh.geometry, part.mesh.matrix, i);

        materialArr.push(part.mesh.material);
    });
});

let mesh = new THREE.Mesh(singleGeometry, materialArr);

mesh.geometry.computeFaceNormals();
mesh.geometry.computeVertexNormals();

this.scene.add(mesh);

}

I expect there to be no errors, but I get an error none the less.

#three-js #javascript