Errors when adding orbitalcontrols.js

This is how i am linking files

   <script src=""></script>
    <script src=""></script>
    <script src="index.js"></script>

and this is how i am initializing orbital controls

const orbitControl = new THREE.OrbitControls(camera, renderer.domElement);

and this is the error i am getting

OrbitControls.js:1 Uncaught ReferenceError: require is not defined
    at OrbitControls.js:1
(anonymous) @ OrbitControls.js:1
index.js:85 Uncaught TypeError: THREE.OrbitControls is not a constructor
    at index.js:85

I tried everything i could but cannot resolve it. Please help!

This version of OrbitControls you are trying to include is meant to be used within an npm project, and not directly imported in a browser.

Try including this version instead:

Thanks for the reply i appreciate it, but it’s still producing an error

Cross-Origin Read Blocking (CORB) blocked cross-origin response with MIME type text/html. See for more details.
index.js:83 Uncaught TypeError: THREE.OrbitControls is not a constructor
    at index.js:83
(anonymous) @ index.js:83

It’s still producing those two errors, for the latter error i tried to remove the THREE. but still i produced a an error, something along the lines of “orbitcontrols is not defined”

Try it with these two imports:

<script src=""></script>
<script src=""></script>

In general it makes no sense to import library files from different CDNs. And it’s definitely wrong to import three.js files from different releases.

1 Like

Thank You! It’s working again :slightly_smiling_face:

I was trying to find cdn for the latest release but was having trouble, so i used the r128 version, but now i know that i should use the latest release and the same cdns

1 Like