Getting error : Invalid property x set to -100 Missing plugin? gsap.registerPlugin()

Question

I'm trying to make an animation of my cards in my Vue application with GSAP. I tried to follow a codesandbox example I found earlier but I can't make it work with my app.

Here's the link

I have everything the same as in the example except that I'm not getting an array of HTMLDivElement with this.boxes.$refs.boxes but an array of VueComponent

When I'm trying to apply the gsap transformation with

this.tl = gsap
        .timeline()
        .from(
            this.boxes.$refs.boxes,  
            {duration: 1, x: -100}
        );

I get an error in my web browser :

Invalid property x set to -100 Missing plugin? gsap.registerPlugin()

After looking on many forums I can't find a solution working for me.

---

After some search I finally ended up with this solution, I don't really know if this is a good way to do it and since it's a school project I don't want to spend too much time on it.

gsap
    .timeline()
    .from(
        ".anime-card",  
        {y: -25, opacity:0, stagger: 0.1},

    );