Tech Nomad

Hey Jack, thank you for the quick response! 1. Difficult to say - I am changing all the time something in the project. 2. I mean 30kb without gzip (as showed in my local project folder) 3. In fact it works! The total size is exact 30kb smaller and no errors are produced. I don't remember why I switched to UMD I've just only noted this link in the comments of my code: 4. Sounds great! Now I'm curious Thank you again!

Hey guys, I'm getting suddenly issues with TweenMax in my project. It has worked fine for a while after following up this post. But recently I've got TweenMax variable not defined errors when running "build" / production npm script. So I've made the same thing with TweenMax as suggested for the ScrollToPlugin in the post: const TweenMax = require("gsap/umd/TweenMax"); Worked indeed. But now I get: ERROR in ./src/vendor/greensock-js-business-green/src/minified/plugins/ScrollToPlugin.min.js Module not found: Error: Can't resolve 'TweenLite' in '/Path/to/project/src/vendor/greensock-js-business-green/src/minified/plugins' When I include the ScrollToPlugin like this: const ScrollToPlugin = require("gsap/umd/ScrollToPlugin"); ... then I don't get any errors when compiling the app bundle. But the problem is TweenLite gets included on the top of TweenMax, which adds 30kb more to the already huge app. I've tried then to in include the plugin from the greensock-js-business-green minified folder. But then I get this module not found error mentioned above. So how can I include the ScrollToPlugin in a Webpack app without having to include TweenLite on the top of TweenMax? Thank you in advance! P.S. MorphSVGPlugin seems not to cause these troubles when including from the "umd" folder : const MorphSVGPlugin = require("~/vendor/greensock-js-business-green/src/bonus-files-for-npm-users/umd/MorphSVGPlugin.js");

Wow, thank you for so many replies! I got this working with the Craigs idea to loop through all the paths. But I still have used snap.svg ? I currently can't effort to spent 150$ to just for animating the logo ? Or is it actually only 99$ if I use it for my private but still commercial app? But one day I will purchase the membership anyway as I use TweenMax quite often also for the app itself outside the logo animation.

Any Ideas?

Ok, I found out a way to export the logo as a single path, and the snap.svg bounce animation works indeed. The only problem is that the whole graphic is now fractured/broken:

Hey Guys, I need to animate a bouncing transition of two states of an SVG logo. But struggle to find a solution. It seems there is no native CSS transform function like the "envelope distort ---> make with Warp" function in Illustrator CC. I found out you can morph paths with snap.svg but my Logo consist of multiple paths which I want animate synchronously / all together. Do you maybe know what I have to look for? Thank you in advance. These are the two states I have to animate: