Any solid instructions to setup GSAP with Yarn 4

[upcoming.studio]

My current setup uses Yarn Classic to manage packages, it's working alright for now but we are going to move to Yarn 4 and so far, I haven't had great results. 

Current Setup with Yarn Classic: 

 

package.json: 

"dependencies": {
  ...
  "gsap": "npm:@gsap/shockingly",
  ...
}

.npmrc:

always-auth=true
@gsap:registry=https://npm.greensock.com
//npm.greensock.com/:_authToken=$GSAP_TOKEN
//registry.npmjs.org/

all this works. 

 

—————

 

Now with Yarn 4.3.0:

YN0001: │ Error: gsap@npm:@gsap/shockingly isn't supported by any available resolver
    at Pd.getResolverByDescriptor (/Users/riomar/Developer/-workspace/monochrome/monochrome-website/frontend/.yarn/releases/yarn-4.3.1.cjs:141:1698)
    at Pd.bindDescriptor (/Users/riomar/Developer/-workspace/monochrome/monochrome-website/frontend/.yarn/releases/yarn-4.3.1.cjs:141:1083)
    at St.preparePackage (/Users/riomar/Developer/-workspace/monochrome/monochrome-website/frontend/.yarn/releases/yarn-4.3.1.cjs:210:6173)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Z (/Users/riomar/Developer/-workspace/monochrome/monochrome-website/frontend/.yarn/releases/yarn-4.3.1.cjs:210:7587)
    at async Promise.allSettled (index 0)
    at async _c (/Users/riomar/Developer/-workspace/monochrome/monochrome-website/frontend/.yarn/releases/yarn-4.3.1.cjs:140:53129)
    at async /Users/riomar/Developer/-workspace/monochrome/monochrome-website/frontend/.yarn/releases/yarn-4.3.1.cjs:210:9166
    at async Ft.startProgressPromise (/Users/riomar/Developer/-workspace/monochrome/monochrome-website/frontend/.yarn/releases/yarn-4.3.1.cjs:140:137362)
    at async St.resolveEverything (/Users/riomar/Developer/-workspace/monochrome/monochrome-website/frontend/.yarn/releases/yarn-4.3.1.cjs:210:7138)
➤ YN0000: └ Completed

 

It is probably due to .npmrc not being read anymore. 

So I create .yarnrc.yml:

nodeLinker: node-modules

npmScopes:
  gsap:
    npmRegistryServer: "https://npm.greensock.com"
    npmAlwaysAuth: true
npmRegistries:
  npm.greensock.com:
    npmAlwaysAuth: true
    npmAuthToken: $GSAP_TOKEN

But not much luck there too, same error.

 

—————

 

Been browsing around the web and nothing solid comes back. It would be great if these were documented by GSAP on the installation instructions, as it feels quite inconsistent throughout the forums too. 

 

Any help would be appreciated.

Cheers

 

[Cassie]

Hey there, yeah, Yarn is a bit of a tricky on with private registries.

 

There's been really intermittent results in the past with setups that we've recommended. I did a bit of a deep dive recently and it looks like this is the best route with yarn berry.
 

 

yarnrc.yml file set up like this - 

unsafeHttpWhitelist:
  - "npm.greensock.com"

npmScopes:
  gsap:
    npmRegistryServer: "https://npm.greensock.com"
    npmAuthToken: <YOUR TOKEN>

I've been trying to get some more confirmation on this before updating the docs, maybe you could let me know how it goes for you?