[ReactJS (webpack) / GSAP / Plugins]

47 minutes ago, ZachSaucier said:

Hey lio and welcome to the GreenSock forums!

 

We highly recommend using the GSAP Install helper in our docs until you get used to the GSAP importing format. Clicking the check box for TextPlugin will show you that the correct format is:

import { gsap } from "gsap";
import { TextPlugin } from "gsap/TextPlugin";

gsap.registerPlugin(TextPlugin);

Happy tweening.

 

Thanks a lot !!

[ReactJS (webpack) / GSAP / Plugins]

Hello, I use TweenMax in React, no worries until then. Now I would like to use the TextPlugin plugin but I can't get it work with the import...

 

 

import {TweenMax} from "gsap";

const TextPlugin = require("gsap/TextPlugin");

const About = () => {
  let xpRef = useRef<HTMLHeadingElement>(null);
  let educRef = useRef<HTMLHeadingElement>(null);

  useEffect(() => {
    TweenMax.to(xpRef.current,1, {text: "This is the new text", ease: "none"});
    TweenMax.to(educRef.current,1, {text: "This is the new text", ease: "none", delay: .3});
  }, []);

 

I test that too :

 

import {TweenMax, TextPlugin } from "gsap/all";

const plugins = [TextPlugin];

const About = () => {
  let xpRef = useRef<HTMLHeadingElement>(null);
  let educRef = useRef<HTMLHeadingElement>(null);

  useEffect(() => {
    TweenMax.to(xpRef.current,1, {text: "This is the new text", ease: "none"});
    TweenMax.to(educRef.current,1, {text: "This is the new text", ease: "none", delay: .3});
  }, []);

Both of them didn't work

Many thanks in advance