ES6 Modules Proof of Concept

[GreenSock]

Yes please! Blake, tell me you found that magic flag we cant set for instant compatibility with every build system in the entire JS ecosystem!

[Guest Vic_]

I see, thx Blake. I assumed you wanted to start w/ cleaner classes where .ts would help. 
I believe that HTML standard still have to come up for the standards on modules. For now my fave is Webpack - but the usable thing today is HTML5 Web Components or AMP (in-lined .css). I don't think GSAP by self is a module - an interactive 'stars' rating system would be a module (that has GSAP).
Webpack by self is not rewarding due to effort level.
So I think best to wait for HTML standards to define a module. 

Anyway - this is outside of my depth, good luck and thx as always.

Vic

[pastelsky]

Just chiming in to say, that a lot many projects now use ES6 from the start. As others have pointed out, module bundlers like Rollup, Webpack, and SystemJS have been there for quite some time, and one does not need to wait for finalisation of Module syntax, or even their implementation. If github stars were to be taken a measure of popularity / usage, then Webpack (19k) stars is pretty close to Gulp (23k) and rising faster than traditional build systems.

 

 

While it's cool if the GSAP team wants to focus on improving core animation, there hasn't been a better time to implement ES6 modules now that the bundling ecosystem has become comfortably mature and some of the many popular libraries are being re-written in ES6. There's hardly any reason to wait for browsers to implement the syntax ( a good 3-4 years before anyone starts using modules as it is). As far as maintaining separate builds are concerned, they almost never require separate maintenance, apart from a one time configuration, which gives you compatibility with UMD, ES6, and browser builds out of the box.

[zero0000]

It's nice to nom install and get `import { TweenLite, Elastic, CSSPlugin, TimelineLite } from "gsap";` Is there anyway to import Draggable like this?

[GreenSock]

The main (entry) JS file that the "gsap" package points to is TweenMax.js but since Draggable isn't part of TweenMax, it wouldn't work to just import from there. Sorry. We do plan to restructure things at some point, but we're not there yet (doing so isn't trivial). In the mean time, you should be able to just import the Draggable file directly (not from "gsap") or set up an alias in your config file that associates "Draggable" to that file path. Let us know if you need help with that.