Closed

Description
The main source code has recently been ported to ES2015 modules (see #9310); however, some parts are still relying on global namespace pollution and have thus become unusable.
Specifically the things in /examples/js/
haven't been transformed to support modules yet; this makes them currently unusable from within environments such as webpack or SystemJS.
Edit, 11-20-2016: They can be used, but it requires a lot of setup: SystemJS, webpack. If you need assistance with these: Sorry, but this is the wrong thread to announce it! 😄
Activity
[-]Transform examples/js to support modules[/-][+]Transform `examples/js` to support modules[/+]ghost commentedon Aug 22, 2016
Side note: You could theoretically use these from within webpack by injecting the global
THREE
variable (and others, depending on what you're trying to load) using imports-loader, but the problem still remains for SystemJS and native module evaluation that will eventually land in browsers.mrdoob commentedon Aug 23, 2016
I don't know how this can be fixed. We can't turn those files into ES6 Modules because, not only browsers don't support them yet, we want to support old-ish browsers too.
So, as far as I can see, the "hack" for Webpack and SystemJS is the price to pay for now?
andrevenancio commentedon Aug 23, 2016
Either things like
examples/js/postprocessing/
become a module of themselves or we need to come up with some kind of plugin logic.@mrdoob what if github.com/threejs becomes a thing? You can create different repos inside of it which have a similar build system as the current
threejs
, which can be used via modules or people can just download the legacy code in thebuild
folder. Again with thepostprocessing
in mind, it will haveTHREE
has a dependency, and it would be both a module or you can use the/build/EffectComposer.js
for legacy code?mrdoob commentedon Aug 23, 2016
I have a hard time maintaining one single repo already 😕
andrevenancio commentedon Aug 23, 2016
the idea was to give you and the maintainers more control over the releases, a bit like
https://github.com/airbnb
orhttps://github.com/facebook
I'm happy to pick up some bits and bobs as I need them but you'll end up withgithub.com/randomuser/effectscomposer
github.com/randomuser2/orbitcontrols
:(GGAlanSmithee commentedon Aug 23, 2016
Does it really make sense to make the examples be modules though? If I understand it correctly, the examples are consumers of three, not a part of it. They are there to provide you with example usages of
three.js
.I think a more correct way to go about it would be to move as much as possible to the core of
three.js
and rely on tree shaking to eliminate dead code. (I understand this will be problematic for users that does not want to use a build pipe of their own though..)andrevenancio commentedon Aug 23, 2016
We're not saying we should have the examples as modules. We're saying that some of the files referenced in the
examples
folder aren't yet modularised, likeOrbitControls.js
orEffectsComposer.js
or many others that are very often used in demos, prototypes and even in production. Those files, should be, as I was suggesting, modules of their own, outside of three.jssatori99 commentedon Aug 23, 2016
I agree in regards to
OrbitControls
and the the other control classes. They are too useful to be just examples.killroy42 commentedon Aug 23, 2016
I wrote a small universal module loader, which supports various module systems and falls back to global namespace. It makes it all work, just by including the script. Should I do a demo with it for the examples?
mrdoob commentedon Aug 23, 2016
What does that mean? Do you mean that they are too commonly used?
satori99 commentedon Aug 23, 2016
Yeah exactly. Especially OrbitControls. It might just be me, but I end up including that file a lot.
danrossi commentedon Aug 23, 2016
I've ported OrbitControls over to a module, you can do something similar. My version has some changes when to dispatch start events on movement.
It can then include it within Three.Js main app file ie
I've had to include other examples that are not modules yet, you concat them in with rollup in the rollup script like so
https://github.com/danrossi/three-vr-orbitcontrols
I've done something similar for the VREffect but have refactored and cleaned it up also.
https://github.com/danrossi/three-vreffect
killroy42 commentedon Aug 23, 2016
Perhaps we could start a small initiative to modularize these commonly used helpers from the examples. Clean them up and improve the quality (For example I rebuild the FPS controller to include keyboard controls, events, etc).
375 remaining items