user12649875
user12649875

Reputation:

THREE.OrbitControls is not a constructor, can't figure what to do

I'm trying to add OrbitControls, but I always get this error at this instruction:

var controls = new THREE.OrbitControls( camera, renderer.domElement );

I've installed with npm three.js and three-orbitcontrols.js, I've read all the answers but I still can't figure out what I should do. If I use require or import in my jsp page, I still get this problem. I've also tryied using browserify but it didn't help (I got an EPERM error, so maybe I did something wrong?).

Can someone help me? What did I miss?

Edit: I've realized that I wrote OrbitControls.js instead of three-orbitcontrols.js, so sorry about that. Also, if I try to use import console says:" SyntaxError: Cannot use import statement outside a module"

Upvotes: 2

Views: 1887

Answers (3)

user12649875
user12649875

Reputation:

In the end, the problem was that I used browserify in the wrong folder: now I've created the bundles and it works, thanks for the replies.

Upvotes: 0

rvcristiand
rvcristiand

Reputation: 452

You need to install three-orbitcontrols since OrbitControls isn't in the three.js npm package.

To install OrbitControls use

npm install three-orbitcontrols

Edit

The OrbitControls npm package said:

three-js exposes real modules now via three/examples/jsm/... for example to import Orbit, do import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'

So, you can use real modules using

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

Upvotes: 1

Francisco
Francisco

Reputation: 1773

Try to import like this

import * as THREE from 'three';

var controls = new THREE.OrbitControls( camera, renderer.domElement );

at the top of the file.

Upvotes: 0

Related Questions