[TweenLite inside of react project not working after build]

On 4/24/2020 at 11:27 PM, OSUblake said:

For v2.

import { TweenLite, ScrollToPlugin } from "gsap/all";
const plugins = [ScrollToPlugin];

// if you need to animate CSS properties
import { TweenLite, CSSPlugin, ScrollToPlugin } from "gsap/all";
const plugins = [CSSPlugin, ScrollToPlugin];

 

But I would recommend upgrading to v3.

 

 

 

Thanks @OSUblake this solution works!

 

 

[TweenLite inside of react project not working after build]

I am having an issue on my production build  (npm run build) where GSAP TweenLite plugin is not working and throwing an error Uncaught TypeError: Failed to execute 'scrollTo' on 'Window': parameter 1 ('options') is not an object.My local development server seems to work fine.

 

Local: console.log(com.greensock.plugins.ScrollToPlugin.version); -> //1.9.2

Production console.log(com.greensock.plugins.ScrollToPlugin.version); -> //Uncaught TypeError: Cannot read property 'version' of undefined at <anonymous>:1:50

devDependencies "gsap": "^2.1.3",

 

Component:

import { TweenLite } from "gsap/all";
..

const handleOnClick = id => {
    let headerHeight = 90; // height of the sticky nav
    let paddingTop = 20; // add some padding.
    TweenLite.to(window, 0.5, { scrollTo: { y: `#${id}`, offsetY: headerHeight + paddingTop } });
};

//Map function
...
<li key={item.id} onClick={() => handleOnClick(item.id)}>
    <span className="text">{item.text}</span>
    ...
</li>
...