three.js load obj models and textures

1.Vue three.js installed and loaded with the packet

Installation three.js use npm install three --save
package installed add obj and mtl filesnpm install three-obj-mtl-loader

2.Vue three.js referenced and loaded with the packet

Here threejs I was introduced as a global variable
main.js code is as follows:

import * as THREE from 'three'
Vue.prototype.THREE = THREE

Loading corresponding component class introduced

import { OBJLoader, MTLLoader } from 'three-obj-mtl-loader'

3. For the obj and mtl file description

3D software exported file contains: obj is a 3D model, mtl path is made, there are some pictures.
The picture is called material, mtl file defines the model corresponding to these maps, a large obj file will have many sub-model, there will be a lot of sub-mtl modules, each module has a corresponding maps and map path, which is linked obj mtl and image files bridge.

4. Load obj models and textures

 var mtlLoader = new MTLLoader()// mtl材加载器
      mtlLoader.setTexturePath('/data/tex/')// 材质加载路径
      mtlLoader.load('/data/Shuriken.mtl', materials => {
        materials.preload()
        var objLoader = new OBJLoader()
        objLoader.setMaterials(materials)
        objLoader.load('/data/Shuriken.obj', (obj) => {
          obj.traverse((child) => {
            if (child instanceof that.THREE.Mesh) {
              child.material.side = that.THREE.DoubleSide
              child.scale.set(50, 50, 50)
            }
          })
          that.scene.add(obj)
        })
      })

mtlLoader.setTexturePath('/data/tex/')
This is the material load path, and this should mtl file path is the path to combine the corresponding picture material.
obj.traverse((child) => {}
To traverse each sub-model obj file, attention must need if (child instanceof that.THREE.Mesh)this judgment, because through the returned child not only has there Mesh Group, we only need to Mesh operation can be friends.

The problems encountered

(A) file path problem

3D software export file should be placed in the static folder, for Vue3 + terms are public documents, so when referenced to use the "/." mtlLoader.load('/data/Shuriken.mtl'Single slash means that public folder, this folder static at compile time is not compiled its address, so the server is placed on the address.

(B) threejs version of the problem

Error: xxx has been removed, plase use loadingManager ...

The reason for this is to use an older version of the way when loading mtl file.

solution:

1. Open the corresponding file index.js
2. Find the corresponding position change
my question is because Handler.get method has no friends, using manager.getHandler (), the code is about to be deleted under the arrow in the figure of the second half, recovery code box on the line.