npm / ReactJS / GSAP / ES6: importing subscription paid plugins

[d11202]

Hello Greensock world!

 

Using the Greensock 1.19.1 npm download:

 

I'm polishing up my Greensock skills in the world of ReactJS/ES6/Webpack. I've read similar posts on this forum which have been helpful but perhaps outdated.

 

I'm a bit unsure how to get the subscription-paid plugins working with the npm download, for example on line 4 where I import TweenMax I was hoping to add ScrambleText or other plugin name, however this doesn't work.

 

Is there any up-to-date documentation that covers ES6 import of the subscription plug-ins?

// The following import works for TweenMax,
// however if the ScrambleTextPlugin.js is placed in the npm_modules/gsap
// directory alongside TweenMax.js it doesn't import.
import { TweenMax, ScrambleText } from gsap

Many thanks in advance

[GreenSock]

In the bonus zip download, you should see a folder named "commonjs-flat" - that's for NPM users where all the files are tossed into one flat directory and the require() statements are adjusted accordingly. Otherwise, if you're using the stuff from inside the "uncompressed" folder, for example, there are sub-directories and it's a bit more cumbersome to do your imports. I wonder if maybe you took ScrambleTextPlugin from that "plugins" subdirectory and dumped it into the root "gsap" directory of your NPM module, thus it was looking for the "TweenLite" that's one directory up (and couldn't find it). 

 

See what I mean? 

 

In fact, it'd be fine to just replace everything in the npm_modules/gsap folder with the files in the "commonjs-flat" directory from the download zip. I'll probably rename that directory soon, though, to something like "bonus-files-for-npm-users". 

[d11202]

Hi Jack

 

Thanks for your speedy reply. Yep, that makes sense.

[CourseIng]

Hello Jack, previously i had the similar problem. Thanks so much providing good solution,  it is really suitable for my issue.

 

Best Regards,

CourseIng- ReactJS Online Training in India