Nuxt 3 importing club SplitText plugin

[1haker]

Hello, im trying to use SplitText club plugin, but i can't make it work. I've searched in forum but no similar issue found.

1. Club token added to `.npmrc`

//npm.greensock.com/:_authToken=xxxxxxx
@gsap:registry=https://npm.greensock.com

2. transpile gsap in `nuxt.config.ts`

 build: {
    transpile: ['gsap']
 }

3. Register plugins in `/plugins/gsap.ts` (this also doesn't work `/plugins/gsap.client.ts`) such as:

import gsap from 'gsap'
import { ScrollTrigger } from 'gsap/ScrollTrigger'
import { SplitText } from 'gsap/SplitText'

export default defineNuxtPlugin(() => {
  gsap.registerPlugin(ScrollTrigger)

  if (process.client) {
    gsap.registerPlugin(SplitText)
  }
})

Everthing works fine in local build, but not in actual build on server, this is my error:

 

* Also I find here https://github.com/hypernym-studio/nuxt-gsap/pull/41 this comment:

Quote

...premium plugins are not available in the node_modules directory unless the user installs them manually (default ones are automatically installed when user installs gsap pkg), so importing them into the plugin (client/browser side) without dynamic imports or some kind of magic won't work.

(actually same error using nuxt-gsap) So maybe somehow `gsap/SplitText` is not visible for build ?

I tried to make minimal repo, which is oddly working fine (just add authToken to `.npmrc`): https://stackblitz.com/edit/github-fhtp4t-jgbsnt?file=nuxt.config.ts,pages%2Findex.vue,.npmrc

[1haker]

[SOLVED] I have to remove `package-lock.json` and run `npm install` again, then i notice changes in lock-file, for club plugins make sure there is this entry:

"node_modules/gsap": {
      "name": "@gsap/business",
      "version": "3.12.1",
      "resolved": "https://npm.greensock.com/@gsap%2fbusiness/-/business-3.12.1.tgz",
      "integrity": "...",
      "license": "This package should only be used by individuals/companies with an active Business Green Club GreenSock membership. See https://greensock.com/club/. Licensing: https://greensock.com/licensing/"
    },

before removing lock.json it looked like this: 

"node_modules/gsap": {
      "version": "3.12.1",
      "license": "This package should only be used by individuals/companies with an active Business Green Club GreenSock membership. See https://greensock.com/club/. Licensing: https://greensock.com/licensing/"
    },

 

[NirvanaWorld]

First, need to confirm if you are a member of the GSAP Club?