Uncaught TypeError when accessing OrbitControls from unpkg.com

[neilgd]

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.

[GmBodhi]

Use https://cdn.skypack.dev/three instead.
Refer: Migration-Guide

[Mugen87]

This is due to #21654 which changed the import statements of examples/jsm modules in the npm package 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/

[x1911]

the loading is too slow, and it reload everytime.

how can we use the faster version with this cdn?

and the example code

 * Pinned URL: (Optimized for Production)
 *   ▶️ Normal: https://cdn.skypack.dev/pin/three@v0.128.0-mdxNJqSFIu40tgtjPy6F/mode=raw/three.module.js
 *   ⏩ Minified: https://cdn.skypack.dev/pin/three@v0.128.0-mdxNJqSFIu40tgtjPy6F/mode=raw,min/three.module.js

it wont work

[GmBodhi]

I think It'll be better to host it on your webserver for the time being.

[x1911]

@GmBodhi so loss the meaning of cdn, cdn should load it faster and save the bandwidth of own webserver

[donmccurdy]

Looks like unpkg has an experimental ?module option 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.

[x1911]

today new error

[Mugen87]

@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.

[x1911]

@Mugen87
https://jsfiddle.net/x1911/3x0rv8y9/

it stucks in gltf loader loading

[donmccurdy]

@x1911 your example worked for me the first time I tried, but failed the next time. In my case it was OBJLoader that failed to load, and even directly accessing https://cdn.skypack.dev/three@v0.128.0/examples/jsm/loaders/OBJLoader.js shows an error. This appears to be a temporary problem with the Skypack CDN, and is reported on their status page here: https://status.skypack.dev/. Skypack claims that only development URLs are affected and their production URLs are fine, but I'm not sure what that means. The unpkg ?module option may also be worth a try.

[Mugen87]

I'm not able to reproduce the issue. Seems Skypack fixed the issue on their side.

[x1911]

it works now, thanks

@donmccurdy unpkg ?module option works now, seems also a better choice than skypack.dev

https://jsfiddle.net/x1911/ca5jLzyq/