three.js: Uncaught TypeError when accessing OrbitControls from unpkg.com
With version 128, the following code:
<script type="module">
import * as THREE from 'https://unpkg.com/three@0.128.0/build/three.module.js';
import { OrbitControls } from 'https://unpkg.com/three@0.128.0/examples/jsm/controls/OrbitControls.js';
</script>
causes the following error:
Uncaught TypeError: Failed to resolve module specifier "three". Relative references must start with either "/", "./", or "../".
It worked fine in 127 though.
About this issue
- Original URL
- State: closed
- Created 3 years ago
- Comments: 16 (3 by maintainers)
Commits related to this issue
- Update script.js Update of three.js to 128 required use of another CDN. refer: https://github.com/mrdoob/three.js/issues/21707 — committed to Corbe30/Three.js-Login-Page by Corbe30 2 years ago
- Apply bandaid for threejs breaking change https://github.com/mrdoob/three.js/issues/21707 — committed to nonvegan/lorenz-attractor-3d by nonvegan 2 years ago
@Mugen87 https://jsfiddle.net/x1911/3x0rv8y9/
it stucks in gltf loader loading
Looks like unpkg has an experimental
?moduleoption you can add to the URL that allows it to work with three.js too:https://discourse.threejs.org/t/importing-jsm-modules-using-explicut-urls-no-longer-works-for-basic-jsfiddle-examples-since-r128/25858/3
I’d be curious if you are seeing loading time differences between Skypack and Unpkg?
That said, yes, local development will allow you to work much faster. So far https://www.skypack.dev/ seems like one of the more user-friendly options. Then you can deploy to something with a CDN cache (e.g. netlify handles this automatically) when you are finished working locally.
This is due to #21654 which changed the import statements of
examples/jsmmodules in thenpmpackage to bare imports.As mentioned by @GmBodhi you have to use other CDNs like skypack. A respective fiddle looks like so:
https://jsfiddle.net/n9rwdxkL/
Use https://cdn.skypack.dev/three instead. Refer: Migration-Guide
@x1911 Please demonstrate the issue with a live example.
BTW: Just sharing a screenshot of the error is not helpful if you don’t share more information about your setup.