Build OrbitControls example to work with three.min.js

Questions
1

I did a ‘npm run build’ on a checked out repo but only get the three.js in build folder.
How do I use the OrbitControls example with three.min.js?

I am using requirejs to load three.min.js. So, not directly as a script tag with type=module.

2

If you checked out the repo from github, you should have at least 3 files in the build/ directory from the start (even without running the build) - see here.

Do you get any errors in the console when running npm run build ?

3

Yes, I have all three files (three.js, three.min.js, three.module.js).
The problem is that I am not sure how to mix three.min.js (which I load via requirejs) with the OrbitControls example. I do not want to copy/deploy the whole repo to my production environment, just three.min.js and the OrbitControls.js.

Actually, I need OrbitControls.js as a npm module.

4

It can’t be mixed (unless you do it yourself ofc.) Examples are meant to be separate from the library build.

You can either copy the file manually (which, as horrible as it sounds, is ok to do), or import directly from examples/jsm/controls/OrbitControls.js (that’s probably the usual way of importing examples, see for example here, the imports at the top.)

5

I see. But how do you guys keep in sync with changes? Re-copy the files all over again and patch own modifications?

I ended up using it this way, in case someone else is interested and/or can review this approach:

define(['three-min'], function(THREE) {
// simulate imports
const {
	EventDispatcher,
	MOUSE,
	Quaternion,
	Spherical,
	TOUCH,
	Vector2,
	Vector3
} = THREE;
	
	// copy and paste contents of OrbitControls.js here
	...
	
	// simulate exports
	THREE.OrbitControls = OrbitControls;
	THREE.MapControls = MapControls;
	
	return THREE;
});