GSAP Business causing git commit error

[Karsh Hagan]

Hello,

 

I am trying to push a commit to github which contains use of some GSAP paid plugins and am getting an error on GH that says it cannot locate the .tgz file. Has any encountered this or have solutions to get a clean commit?

 

FYI: I have included the .tgz file in the gitnore as per the license agreement.

[GreenSock]

First of all, thanks for being a Club GreenSock member, @Karsh Hagan! 💚

 

That error indicates that you didn't properly set up your .npmrc file or something like that - notice that it's trying to pull the members-only package from registry.npmjs.org instead of npm.greensock.com. There's your problem. Please follow the instructions at https://greensock.com/docs/v3/Installation#private

 

-OR- you could download the zip file from your account dashboard and drop the gsap-bonus.tgz file into your project directory and run npm install ./gsap-bonus.tgz there if you'd like to avoid the registry altogether. 

 

Good luck!

[Karsh Hagan]

I uninstalled gsap from the entire project and reinstalled via npm with the tgz file. I am now getting a different error from github. Any thoughts here @GreenSock?

[GreenSock]

Never heard of that one before. Maybe try clearing your cache (like npm cache clean --force), deleting your lock file(s), and make another attempt. It sure seems like something locally in your setup there. 🤷‍♂️

[Karsh Hagan]

@GreenSockI just tried the installation on a fresh project and still gets that error so i'm not sure whats happening here. I see the paid plugins in the gsap folder within node-modules, do these file reference the .tgz file? 

 

Since the .tgz files cannot be uploaded to github how does the website know where to find them?

[Rodrigo]

1 minute ago, Karsh Hagan said:

Since the .tgz files cannot be uploaded to github how does the website know where to find them?

You could upload the files to a private repo without any issues, then you can deploy in different services using those files.

 

If you are using a public repo, then you ideally should use a .npmrc file and provide the token in your CI/CD pipeline.

 

Just out of curiosity, you mention committing the files to the repo, but the errors come from a installation process, are you using some pipeline for deploying this?

 

Is this actually working on your local environment? Did you deleted the lock file, ran a fresh install and then push your new lock file to github?

 

I always try to go with the .npmrc file route and exhaust all possible options before resorting to the .tgz file. It would be great to know exactly the flow you have and what you have tried so far.

 

Happy Tweening!

[Karsh Hagan]

@Rodrigo Thanks for the info, I just tried to install with private registry. Turned out I already had created a .npmrc file with my gsap credentials. This also did not work and threw an error in github. Attached a screenshot. 

 

So far I have tired both strategies outlined in the video.

 

First, I had gsap free installed before so I removed gsap completely then I installed the .tgz file directly with npm. I was able to use it locally and create my interactions with no errors but when I went to publish to github I received a commit error (previous screenshot). 

 

Next, I removed gsap completely again and tried the private registry route. I opened the npmrc file with vim and my credentials were in there (I remember setting this up when I first started) then ran "npm install gsap@npm:@gsap/business". Again I can still use locally but when I make commit I got an error (this screenshot). 

 

I have tired both steps on both my working project and a completely new project and the same errors persist.

 

As a note I am using github and jsdelivr to connect my code to my website. Not sure if that classifies as a pipeline but when I publish a new version to github I can then update my site with the new version.

[Karsh Hagan]

Solution with private registry: configure the the .npmrc file on the project root NOT computer root. "vim .npmrc" and not "vim ~/.npmrc"

[Karsh Hagan]

@Rodrigo @GreenSockmade another commit an hour or so later and am now getting this error. Any ideas?

[GreenSock]

Very odd, @Karsh Hagan - I'm not an expert on deployment systems or errors like that. Perhaps @Prasanna will have some insight to share. It kinda sounds like your build system used some kind of integrity hash that became invalidated? Have you tried clearing your lock files and NPM cache? I've never heard of an error like this. 🤷‍♂️

[Prasanna]

Hi @Karsh Hagan, it seems like checksum failed - sometimes it is caused due to npm cache. Could you run `$ npm install` in your project again and push the code? That should update the checksum in your project

[Karsh Hagan]

@Prasanna Unfortunately "npm install" has to effect on those errors. The only solution that I have found thus far (not really a solution) is every time I make a push I first run "rm -rf node_modules pnpm-lock.yaml && pnpm install". This will get me a clean push to github but as soon I edit and re-build the code I need to repeat that process or it will throw an error. 

 

As a note I am using PNPM and not NPM with this project*

 

Additionally the "checksums" error occurs when installing gsap via the .tgz file (first screenshot), where as the "Package name mismatch" error occurs when istalling via private registry (second screenshot).

[Prasanna]

@Karsh HaganI'm gonna try and reproduce this now. Will keep you posted..

[Prasanna]

@Karsh HaganI think I found out the problem. The package name mismatch error with pnpm is caused because our registry automatically returns the relevant club greensock package according to your membership. Did you try running `$ pnpm add gsap@npm:@gsap/business` ?