CODEWITHSUNDEEP
javascriptthree.jscdnorbitcontrols
Alessandro Zerbini
Alessandro Zerbini

Reputation: 21

ThreeJs OrbitControl import version from CDN

I'm using threejs from CDN and i need OrbitControl too, but if I use the same lastest version 0.148.0 to import both Three and OrbitControl it don't work:

import * as THREE from 'https://unpkg.com/[email protected]/build/three.module.js'
import {OrbitControls} from 'https://unpkg.com/[email protected]/examples/jsm/controls/OrbitControls.js'

To make it work I need to use FOR OrbitControl Only the lower 0.126.1 version

import * as THREE from 'https://unpkg.com/[email protected]/build/three.module.js'
import {OrbitControls} from 'https://unpkg.com/[email protected]/examples/jsm/controls/OrbitControls.js'

WHY is so? Thank you very much, i'm a total beginnner

Upvotes: 1

Views: 1474

Answers (1)

Mugen87
Mugen87

Reputation: 31016

You need an import map when importing latest three.js releases. Rewrite your imports like so:

import * as THREE from 'three';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';

And in your HTML, put this in your header:

<script type="importmap">
    {
        "imports": {
                "three": "https://unpkg.com/[email protected]/build/three.module.js",
                "three/addons/": "https://unpkg.com/[email protected]/examples/jsm/"
        }
    }
</script>

In this way, the imports will look exactly like in the official examples.

The import map will tell the browser how to resolve the bare module specifier three. More information in the official Installation guide.

Upvotes: 0

Related Questions