javascriptreactjsthree.jsobjloader

three.js OBJLoader not loading in react


I am trying to load an object (.obj) file to use with three.js and react (with react-three-renderer), yet get an My code looks like:

import React from 'react';
import ReactDOM from 'react-dom';
import React3 from 'react-three-renderer';
import TrackballControls from './TrackballControls';
import * as THREE from 'three';
import * as OBJLoader from 'three-obj-loader';
OBJLoader(THREE);

class MyClass extends React.Component {
...
  render() {
    ...
    const objLoader = new THREE.OBJLoader();
  }
}

However, I keep on getting: "export 'OBJLoader' (imported as 'THREE') was not found in 'three' Anyone with an idea?


Solution

  • So it seems that adding this.THREE = THREE to the react component does the trick (weird, eh?). So my code currently looks like:

    import React from 'react';
    import ReactDOM from 'react-dom';
    import React3 from 'react-three-renderer';
    import TrackballControls from './TrackballControls';
    import * as THREE from 'three';
    import * as OBJLoader from 'three-obj-loader';
    OBJLoader(THREE);
    
    class MyClass extends React.Component {
    ...
      render() {
        ...
        this.THREE = THREE;
        const objLoader = new this.THREE.OBJLoader();
      }
    }