search

greensock / GSAP

GSAP (GreenSock Animation Platform), a JavaScript animation library for the modern web
https://gsap.com
19.83k stars 1.72k forks source link

Webpack export is too big... #243

Closed crazyx13th closed 6 years ago

crazyx13th commented 6 years ago

hey there!

I'm using import {TweenLite, Expo} from 'gsap'; But at the end I got with Webpack > CommonsChunkPlugin a "vendor-output" with 114kb!

Is this a normal behavior? Because if I'm using the cdn way I have TweenLite.min.js (28kb) + EasePack.min.js (6kb)

Thanks!

Greetings crazyx13th

crazyx13th commented 6 years ago

grafik if i using this inside my webpack config, size is ok, but than he don't find TweenLite at frontend > uncaught TypeError: Cannot read property 'set' of undefined

jackdoyle commented 6 years ago

"gsap" points to the TweenMax file (which includes TweenLite, all the eases, and a bunch more) - that's why you got a larger file. You can import from "gsap/TweenLite" and "gsap/EasePack" to keep the file smaller, but I'm not quite sure what you're trying to animate so you may need CSSPlugin too.

You could simply load GSAP from a CDN instead of bundling them with your project. Most bundlers like Webpack allow that sort of thing, and it lets you leverage the power of CDNs for super fast load speeds (and leveraging of cache).

I'm not entirely sure what's causing your "set" error (very difficult to diagnose blind).

Lastly, you might want to use Power3 or Power4 instead of Expo ease because those are baked into the core TweenLite file (less file size).

crazyx13th commented 6 years ago

Lastly, you might want to use Power3 or Power4 instead of Expo ease because those are baked into the core TweenLite file (less file size).

good to know!

I only want to call TweenLite.set(...) grafik

inside the chrome console it seems to be available grafik

seems to be a namespace issue :-/ thx!

crazyx13th commented 6 years ago

ok, this solved my problem grafik

AND (!) :

I'm not quite sure what you're trying to animate so you may need CSSPlugin too.

I simply thinking I don't need it... but I was wrong. And later I forgot about it, that i comment it out

THX!

hope tree-shaking feature will be available soon :-) https://github.com/greensock/GreenSock-JS/issues/215

Greetings crazyx13th