Using THREEJS OrbitControls with ES6 module import

Question

When I'm trying to import OrbitControls from the ThreeJS examples, the following errors appear: Attempted import error: 'OrbitControls' is not exported from 'three' (imported as 'THREE').

Here is an example: https://codesandbox.io/s/lyz5y4kq0z

Answer 1

现在有一个使用标准“三个”npm 包的非常简单的解决方案，只需：

import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'

Answer 2

DEPRECATED, PLEASE CHECK https://stackoverflow.com/a/65619187/7355534

---

I finally solved my issue with a simple solution: I removed the code example provided by ThreeJS and I replaced it with a fix.

I've published the corrective here (with some doc): https://gist.github.com/bastienrobert/f381d642da9abaaaf271866db9da59a7

If you have any recommandations, be free to comment!

Answer 3

I think you're trying to access OrbitControls from the instance of THRRE like below

const controls = new THREE.OrbitControls();

But you should try to access the Orbitcontrols like following way

const controls = new OrbitControls();

You can't get rid of this error, if you try to initiate it from THREE. Thanks