this.split is not a function about nuxt-gsap

[ivodolenc]

Hi, thanks for your interest in this module.

Hmm, it's hard to say where the problem is without live repo, but at first I suggest you try this:

// add 'new' before 'this.$SplitText'
const line = new this.$SplitText( // ... )

More info

[merijnponzo]

Hi,
results into

this.$SplitText is not constructor

Maybe you could have a look
https://github.com/merijnponzo/splittextbug

(you can add your token in .npmrc)

[ivodolenc]

Try moving your code logic to the mounted() hook because all extra and club plugins are called only on the client side. If that doesnt work, then i believe there is some issue with the installation process (club plugins).

[ivodolenc]

Closing this because of inactivity.

Another suggestion, try manually importing gsap and club plugins via nuxt plugin system. If it works that way, reopen the issue here.

Also, gsap has some issues with importing club plugins using yarn according to multiple user repors on the official forum.

Please note that this module was developed in accordance with the official guides and documents for importing the gsap core and all extra and club plugins from the public repo.

[merijnponzo]

Hello,
it's mounted() indeed! thanks

[mrtsiradisi]

Hi, I will use the splittext module but I am getting an error. Can you help me?

My Code

const { $gsap } = useNuxtApp();

onMounted(() => {
var childSplit = new this.SplitText(".text-animation", {type: "lines"});
console.log(childSplit);
});

My Error :

index.vue:144 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'SplitText')