three.js-对象不是three.Object3D的实例

我正在尝试使用three.js-with和Webpack

var OBJLoader = require('three-obj-loader')
OBJLoader(THREE)
var loader = new THREE.OBJLoader()

loader.load( require('./sphere.obj'), function ( geometry ) {
    var material =  new THREE.MeshBasicMaterial( { color: 0xffffff } )
    var mesh = new THREE.Mesh( geometry, material )
    return mesh
})

然而，这不起作用。我尝试过延迟网格创建，如在和使用webpack和。还是会犯那个错误

谢谢你粘贴了这个答案 这里来自：

谢谢你使用图书馆

目前，组件假定网格在创建时存在，如

如果您使用的是异步加载程序，则代码可能如下所示：

<template>
  <object3d v-if="mesh" :obj="mesh"></object3d>
</template>

<script>
export default {
  data () {
    return {
      mesh: null // <----
    }
  },
  methods: {
    createBox () {
      objLoader.load(xxx, geometry => {
        let mesh = new THREE.Mesh(geometry, material)
        this.mesh = mesh // <----
      })
    }
  }
}
</script>

---

如果我错了，请告诉我；）

回购所有人通过github回答：

var mtlLoader = new MTLLoader();
mtlLoader.setBaseUrl( 'SpaceFighter03/' )
mtlLoader.setPath( 'SpaceFighter03/' )
mtlLoader.load( 'SpaceFighter03.mtl', ( materials ) => {
  materials.preload();
  var objLoader = new OBJLoader();
  objLoader.setMaterials( materials );
  objLoader.setPath( 'SpaceFighter03/' )
  objLoader.load( 'SpaceFighter03.obj', ( group ) => {
    const body = group.children[0]
    body.material.color.set(0xffffff)
    this.setState({ body })
  })
})