REACT modules, nx deploy app in combination with GSAP Business failure

[BelBarakat]

Hey there,

I'm trying to deploy my REACT APP to Hubspot (https://github.hubspot.com/cms-react/) with GSAP Business library (https://gsap.com/docs/v3/Installation) I used the private registry NPM method, where I install "npm install gsap@npm:@gsap/business" and create a .npmrc file in my root with my registry url and token.

This should be enough for GSAP to be used. Locally everything works and I can use the business plugins from GSAP. But when I try to deploy my modules with "nx deploy app" I get the following error log:

[INFO]   aug. 15 9:30:19AM EDT  Archiving and Zipping Project Source 
[INFO]   aug. 15 9:30:26AM EDT  Uploading Project Source Archive 
[ERROR]   aug. 15 9:30:31AM EDT  npm notice  
[ERROR]   aug. 15 9:30:31AM EDT  npm notice New major version of npm available! 8.19.4 -> 10.8.2 
[ERROR]   aug. 15 9:30:31AM EDT  npm notice Changelog: <https://github.com/npm/cli/releases/tag/v10.8.2> 
[ERROR]   aug. 15 9:30:31AM EDT  npm notice Run `npm install -g npm@10.8.2` to update! 
[ERROR]   aug. 15 9:30:31AM EDT  npm notice  
[ERROR]   aug. 15 9:30:31AM EDT  npm ERR! code E404 
[ERROR]   aug. 15 9:30:31AM EDT  npm ERR! 404 Not Found - GET https://registry.npmjs.org/@gsap%2fbusiness - Not found 
[ERROR]   aug. 15 9:30:31AM EDT  npm ERR! 404  
[ERROR]   aug. 15 9:30:31AM EDT  npm ERR! 404  '@gsap/business@^3.12.5' is not in this registry. 
[ERROR]   aug. 15 9:30:31AM EDT  npm ERR! 404  
[ERROR]   aug. 15 9:30:31AM EDT  npm ERR! 404 Note that you can also install from a 
[ERROR]   aug. 15 9:30:31AM EDT  npm ERR! 404 tarball, folder, http url, or git url. 
[ERROR]   aug. 15 9:30:31AM EDT   
[ERROR]   aug. 15 9:30:31AM EDT  npm ERR! A complete log of this run can be found in: 
[ERROR]   aug. 15 9:30:31AM EDT  npm ERR!     /tmp/cms_BlA6QH/npmLogs/2024-08-15T13_30_29_113Z-debug-0.log 
[ERROR]   aug. 15 9:30:31AM EDT  npm install error for server dependencies 

The registry isn't correct and it should take the right one from the .npmrc file but it seems this file can't be found.

I already have a thread with GSAP to see what the problem migth be but we keep hitting road blocks (https://gsap.com/community/forums/topic/41719-installing-gsap-business-to-vite-project-registry-erro...)

I also tried a different methods to install GSAP with "npm install ./gsap-bonus.tgz" This way on deployment it should unzip this file in Hubspot but also here we get an error log:

[INFO]   aug. 15 3:30:07AM EDT  Archiving and Zipping Project Source 
[INFO]   aug. 15 3:30:14AM EDT  Uploading Project Source Archive 
[ERROR]   aug. 15 3:30:18AM EDT  npm WARN tarball tarball data for gsap@file:gsap-bonus.tgz (null) seems to be corrupted. Trying again. 
[ERROR]   aug. 15 3:30:18AM EDT  npm WARN tarball tarball data for gsap@file:gsap-bonus.tgz (null) seems to be corrupted. Trying again. 
[ERROR]   aug. 15 3:30:18AM EDT  npm notice  
[ERROR]   aug. 15 3:30:18AM EDT  npm notice New major version of npm available! 8.19.4 -> 10.8.2 
[ERROR]   aug. 15 3:30:18AM EDT  npm notice Changelog: <https://github.com/npm/cli/releases/tag/v10.8.2> 
[ERROR]   aug. 15 3:30:18AM EDT  npm notice Run `npm install -g npm@10.8.2` to update! 
[ERROR]   aug. 15 3:30:18AM EDT  npm notice  
[ERROR]   aug. 15 3:30:18AM EDT  npm ERR! code ENOENT 
[ERROR]   aug. 15 3:30:18AM EDT  npm ERR! syscall open 
[ERROR]   aug. 15 3:30:18AM EDT  npm ERR! path /tmp/cms_kvwZaH/cms-js-renderer/gsap-bonus.tgz 
[ERROR]   aug. 15 3:30:18AM EDT  npm ERR! errno -2 
[ERROR]   aug. 15 3:30:18AM EDT  npm ERR! enoent ENOENT: no such file or directory, open '/tmp/cms_kvwZaH/cms-js-renderer/gsap-bonus.tgz' 
[ERROR]   aug. 15 3:30:18AM EDT  npm ERR! enoent This is related to npm not being able to find a file. 
[ERROR]   aug. 15 3:30:18AM EDT  npm ERR! enoent  
[ERROR]   aug. 15 3:30:18AM EDT   
[ERROR]   aug. 15 3:30:18AM EDT  npm ERR! A complete log of this run can be found in: 
[ERROR]   aug. 15 3:30:18AM EDT  npm ERR!     /tmp/cms_kvwZaH/npmLogs/2024-08-15T07_30_16_478Z-debug-0.log 
[ERROR]   aug. 15 3:30:18AM EDT  npm install error for server dependencies 

 
The support of GSAP also has some trouble with finding the problem. Is there something in the deployment that doesn't handle or read GSAP's files correctly? It seems .npmrc or .tgz file can't found when deploying.

We have exhausted so many options and tried so many things but without success ;(

[brtdwchtr]

@BelBarakat did you manage to solve or work around this issue?
Looks like Hubspot is actively rejecting .npmrc files

[BelBarakat · Accepted solution]

Hey @brtdwchtr I uploaded the .tgz file to my own server and changed the package.json to this:

"dependencies": {
    "@gsap/react": "^2.1.1",
    "@hubspot/cms-components": "latest",
    "autoprefixer": "^10.4.19",
    "gsap": "http://myserver.com/gsap-bonus.tgz"
}

 
When deploying the app it pulles it directly from my server without problems. It's a way around but not ideal. I hope Hubspot will fix this problem!