OSUblake

You were importing from gsap-core, so the CSSPlugin gets dropped during a production build. gsap-core is only intended for rare builds, like where you only plan on animating canvas objects.

Probably animate it just like you would with regular canvas or svg, using the stroke dash offset/array. https://codepen.io/osublake/pen/b0137a508fd77217da382a4aa41ec27f

GSAP can also be installed globally, so you only have to import it once. gsap.install(window);

The definitions are essentially global so they can be used by people who don't use modules.

GSAP will be global during development, so that could be why. Once you do a production build, the globals go away due to tree shaking. It's working as designed, which might cause problems for module users, but not everyone uses modules.

Using some gsap utils to animate between gradients with different numbers of color stops. https://codepen.io/osublake/pen/6b1374dbfd8c95e91594faf395f75846

Yeah, this won't work with arbitrary heights. You'd need to use a much more complicated algorithm for that.

The reason that works is because your tweens aren't added to the timeline. Your tweens are running without being part of the timeline. TypeScript is correct.

.add doesn't accept tweens like that. They would have to be in an array. .add( child:[Tween | Timeline | Label | Callback | Array], position:[Number | String | Label] ) : self Also, TweenMax and TimelineMax are deprecated. It's better to switch to new syntax e.g. gsap.to and gsap.timeline.

Something doesn't sound right, but why don't you do a check for setTimeout in your hasWindow function?

Looks like you're off to a good start. You can do movieclips. For scene management, you can group everything inside a container. When a scene isn't in use, remove the scene container from the stage so it doesn't get rendered. If memory becomes an issue, you should probably destroy all the display objects in that container when the scene isn't active. Just animate whatever properties you want. const dropShadow = new PIXI.filters.DropShadowFilter(); mySprite.filters = [dropShadow]; gsap.to(dropShadow, { rotation: 100, blur:

Absolutely. I prefer Pixi, but Phaser is a more complete game engine so you don't have to code a lot of stuff from scratch.

Not sure what you mean. Need to see a demo. Hide it when it leaves the window, or when it's a certain distance away from an edge. What is a mobile device? Most Windows laptops and Chromebooks have touch and mouse inputs. I wouldn't show the ball until there is a mouse event. https://codepen.io/osublake/pen/3170174f4ce844f78c7789a279f8e50e

Loading the module version should be fine, but it's hard to say what your gulp build is doing. I think letting Babel handle the imports can lead to problems. You might be better off using a build solution like webpack, rollup, parcel, etc.

I just made that format up to demonstrate how you COULD create animations from data. I'm sure you could just use the spine json and create gsap animations from it, it'd just take some time understanding the format to create your own parser/runtime. Just took a quick sub-animation snippet from that json file. "front-fist": { "rotate": [ { "angle": -28.43 }, { "time": 0.4333, "angle": -45.61 }, { "time": 0.7333, "angle": -53.66 }, { "time": 0.8667, "angle": 7.56 }, { "time": 0.9333, "angle": 31.16 }, { "time": 1.0333, "angle": -32.59