My JSX does not like my JS file for the ScrollTrigger animations

[thomas.henegar]

I went to this link, trying to incorporate this into my project. The JS file has been one error after another, like "Cannot read property 'addEventListener' of null " (line 68-69) or "TypeError: _toArray is not a function" (Draggable.js, line 2577). 

I had to import Draggable.js and ScrollTrigger.js to get the JS at that link to work, but now I am hitting all these errors.

Is there a simple solution, like to downloading something I missed??? Any help is appreciated, this is for my final project to graduate from coding bootcamp in 2 days!

See the Pen RwKwLWK by GreenSock (@GreenSock) on CodePen

[OSUblake]

By JSX, do you mean React? Maybe this tutorial can help you get started.

https://edidiongasikpo.com/using-gsap-scrolltrigger-plugin-in-react

 

[GreenSock]

That sounds like you just forgot to register the plugins, like: 

gsap.registerPlugin(ScrollTrigger, Draggable);

 

[elegantseagulls]

If you're using React with Next you'll want to import ScrollTrigger and Draggable via:

import gsap from 'gsap';
import ScrollTrigger from 'gsap/dist/ScrollTrigger';
import Draggable from 'gsap/dist/Draggable';