Блог

Я пытаюсь использовать GSAP с react для создания анимации отображения изображения. Вот мой код

   import React, {useRef, useEffect} from 'react';
  import './JumboRight.scss'
  import CSSRulePlugin from "gsap/CSSRulePlugin";
  import { gsap, TimelineLite, Power2 } from "gsap";
  import student from "../../assets/student.webp";
  import {connect} from 'react-redux';
  const JumboRight = (props) =>{

    gsap.registerPlugin(CSSRulePlugin);
    let containerRef = useRef(null);
  
    let heroRef = useRef(null);
    let imageReveal = CSSRulePlugin.getRule(".hero:after")

    const tl = new TimelineLite()
    useEffect(()=> {
      tl.to(containerRef, 0, {
      visibility: "visible"
      }).to(imageReveal, 1.4, {width: "0%", ease: Power2.easeInOut})
    })
    //remaining code
  

Я получаю следующую ошибку:

В чем может быть причина? Как я могу это исправить? Заранее спасибо!