Search code examples
javascriptgsap

TimeLineMax() class doesn't resolve even with including the cdn links

I'm using PHPstorm and I've placed the CDN links right before closing my tag :

const timeLine = new TimeLineMax();
timeLine.from(

  ...

);
HTML code ...

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.1.1/gsap.min.js" type="text/javascript" defer></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TimelineMax.min.js"></script>
<script src="js/main-2.js" type="text/javascript" defer></script>

</body>

</html>

also I'v downloaded the gsap libraries in PHPstorm : screenshot of my editor

But still the PHPstorm doesn't resolve the TimeLineMax() class in my JS file.

Solution

  • It's TimelineMax, not TimeLineMax. Besides, if you're loading GSAP 3 (like you are) you could/should be using GSAP 3's new API format:

    const timeLine = gsap.timeline();
timeLine.from(target, {
  duration: 1,
  ...
});

    You also don't need to load the TimelineMax file, it's included in the GSAP core file that you included. What you're doing is mixing versions, which won't work.