Jump to content
Search Community

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

d11202 test
Moderator Tag

Go to solution Solved by GreenSock,

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

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

Link to comment
Share on other sites

  • Solution

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". 

Link to comment
Share on other sites

  • 4 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...