How to import TrackballControls in React App?

Questions
1

Hey !

As a newbie in THREE.js, I’m enjoying a lot about creative coding. And I’m so happy to discover this forum, and this community. So first, thanks for this!
I’m working with React JS, and I’m wondering how to import THREE plugins, like TrackballControls. I only work with module imports, and even if I tried to import this TrackBall Controls, I still have a problem with import, that says : “‘TrackballControls’ is not exported from ‘three’”. So I’m pretty lost.
Of course, I tried to import this like :
import { TrackballControls } from 'three/examples/jsm/controls/TrackballControls.js';
But, same issue with the same error message…

Does someone know the solution ?

Thanks a lot,

Corentin

2

When importing TrackballControls like so:

import { TrackballControls } from 'three/examples/jsm/controls/TrackballControls.js';

you also have to create an instance without the THREE namespace:

const controls = new TrackballControls( camera, renderer.domElement );

Sometimes users add the THREE namespace (new THREE.TrackballControls) which does of course not work. Does this solve your issue?

1 Like
3

Thanks a lot Mugen !