CODEWITHSUNDEEP
three.js
Lightweight Digital
Lightweight Digital

Reputation: 13

GLTFLoader is not a constructor

I'm new to Three.js and i'm trying to import a simple gltf model into my webpage, but the console returns this error :

Uncaught TypeError: THREE.GLTFLoader is not a constructor

Here is my current code :

    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTC-8" />
        <link rel="stylesheet" type="text/css" href="style.css">
    </head>
    <body>
        <script src="three.js"></script>
        <script type="module" src="GLTFLoader.js"></script>
        <script>
        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight);

        var renderer = new THREE.WebGLRenderer({antialias: true});
        renderer.setSize(window.innerWidth,window.innerHeight);
        document.body.appendChild(renderer.domElement);

        var geometry = new THREE.BoxGeometry(1,2,1);
        var material = new THREE.MeshBasicMaterial({color: 0xff0000});
        var cube = new THREE.Mesh(geometry,material);

        var loader = new THREE.GLTFLoader();
        loadr.load('untitled.glb', function(gltf) {
            scene.add(gltf.scene);
            renderer.render(scene,camera);
        })
        init();

        </script>
    </body>
</html>

I already verified :

• GLTFLoader and three.js is the right, most recent version

• Files are in the right path, also tried to use url-paths from three.js website

If someone has an idea what's going on, it would be a big help.

Thank you very much !

Upvotes: 1

Views: 2687

Answers (1)

Mugen87
Mugen87

Reputation: 31026

It seems you are not importing three.js and GLTFLoader correctly. Try it for now with these two lines and see if it works:

<script src="https://cdn.jsdelivr.net/npm/[email protected]/build/three.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/examples/js/loaders/GLTFLoader.js"></script>

It's recommended to avoid mixing global scripts with modules whenever possible.

Upvotes: 4

Related Questions