Bonjour,

J'essaie THREE.js pour la première fois. J'ai un problème avec OrbitControls, j'ai cette erreur : THREE.OrbitControls is not a constructor. En retirant THREE j'ai OrbitControls is not defined
Mais j'ai surtout cet erreur : OrbitControls.js:1 Uncaught SyntaxError: Cannot use import statement outside a module

Ce que je fais

Décrivez votre code ou ce que vous cherchez à faire.

//Add la scene
const scene = new THREE.Scene();

let camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.z = 100;

let renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight)
renderer.setClearColor(0x062136)

document.body.appendChild(renderer.domElement);

let forme = new THREE.Group()
let geometrie = new THREE.TorusKnotGeometry(10, 3, 100, 16)
let materiel = new THREE.MeshNormalMaterial({})
forme.add(new THREE.Mesh(geometrie, materiel))
scene.add(forme)

//Ici si je commente cette partie alors mon code fonctionne
let controls = new OrbitControls(camera, renderer.domElement); //fonctionne(sans drag and drop) si commenté
//controls.update();

let animer = function () {
    requestAnimationFrame(animer)
    forme.rotation.x += 0.005;
    forme.rotation.y += 0.005;
    renderer.render(scene, camera)
}
animer()

Dans mon body :

    <script src="js/three.js"></script>
    <script src="js/OrbitControls.js"></script>
    <script src="js/script.js"></script>

Merci par avance pour votre aide.

PS : Je suis un débutant qui découvre three js

Aucune réponse