THREE.js orbit controls

using a cdn has its quirks and often depends on the author of the project publishing a version of the javascript library suitable for use in the browser.

In this case the author hasn’t published a suitable version.
As @aldo.ercolani points out - the use of require giving an error is an indication that the javascript is not intended for use as a cdn.
Not publishing a browser version is becoming the norm.

In this situation what I typically do is go to skypack.dev and find the same package.

I then copy the code they provide. console.log what gets imported. And then amend the import statement to be what we want.

<script type="module">
import {OrbitControls} from 'https://cdn.skypack.dev/@three-ts/orbit-controls';
window.OrbitControls = OrbitControls;
</script>

Adding the import to the window object means it can then be imported into an anvil app using python.

Edit:
You can also import this directly in python like so:


OrbitControlsModule = anvil.js.import_from("https://cdn.skypack.dev/@three-ts/orbit-controls")
OrbitControls = OrbitControlsModule.OrbitControls