Text animation does not work in Gulp 4

[samodurow]

I'm trying to run an animation for text. But the problem is that in Codeopen it works, but in my Gulp build it does not work. No errors occur, just ignored.

And other GSAP scripts work, without any problems. 

What can be wrong? I've been struggling with this for 5 hours now...

See the Pen poQbMZw by efremandre (@efremandre) on CodePen

[Rodrigo]

Hi @samodurow and welcome to the GreenSock forums!

 

Sorry to hear about the issues. The only reason I can think of is that, since you mention that other GSAP animations work after the build process, maybe the library you're using for creating the splitted text is being loaded after GSAP and your custom JS code. Do you have any console errors regarding that? Do you see any warnings telling you that a specific target can't be found? Can you confirm in your build app that the library actually exists and that is doing it's job before GSAP animates the results? You might want to run a few console.log() methods in order to check all that.

 

Unfortunately the codepen doesn't tell us what could be the problem.

 

Sorry I can't be of more assistance.

Happy Tweening!

[GreenSock]

The only other thing I can think of is if in your "real" project, the characters that you're animating are display: inline because most browsers won't render transforms on display: inline elements. You've gotta make them inline-block like you did in the CodePen. Like Rodrigo said, it's super difficult to troubleshoot blind. If you can provide a minimal demo that clearly illustrates the problem, I'm sure we'd be able to figure it out. 

[samodurow]

Thank you for responding and wanting to help. I understand that it's hard to do this blindly, but I thought maybe the problem is common and there are suggestions. 

In the end, I figured it out and it was easy. Just spliting connected after gsap, in my gulp.

Thanks again.