Jump to content
Search Community

Vite and gsap private npm plugins (Issue on vite repo)

b1mind test
Moderator Tag

Recommended Posts

Hi all, 

Just wanted to make others aware of an issue when using Club Plugins and Vite via the private repo `npm:@gsap/clubversion`

(work around is use the .tar from membership zip to npm installhttps://github.com/vitejs/vite/issues/2789

 

Sounds like there is issues with Vite seeing the name space correctly for just the plugins but will import from 'gsap' just fine. If any one else has any input please reply to my issue above or drop me a line on the forum here :) . Vite is such a nice dev experience give it a try! 

 

Cheers,

B

  • Thanks 1
Link to comment
Share on other sites

  • b1mind changed the title to Vite and gsap private npm plugins (Issue on vite repo)

So I am still having issues.. but could just be its real late and lack of sleep. I manually set up my (profile) ~/.npmrc originally and been using club plugins in Parcel and Snowpack no issues, tried again with the CLI cmds you provided but still no luck in Vite. 

 

I am sure its something on my end. I will try again in the morning.

 

image.png.c0b3f538934198c3e97b2aa9ba387dda.png

image.png.1cc1406254335078fef219d89e32141e.png

Link to comment
Share on other sites

9 hours ago, Prasanna said:

Yeah, you might wanna delete the node_modules directory before trying again.

I was told by one the contributors in Vites discord it was probably a issue with Vite and how they handle the namespace and to open a issue. Are you saying you have got it working with gsap private registry in Vite ? If so this is going to drive me bonkers.. I still can't get it to work, but would like to resolve this issue if its not something they need to fix.

 

So did a fresh all over again; nuked node_modules, nuked ~/.npmrc, then ran the CLI lines.

image.png.f60fcfe5e432228e65220acf851eacec.png

 

I get this first run dev in Vite (I can comment out ScrollTrigger import and run dev fine with gsap, then uncomment it and get the same above error while its serving dev).. I will try to upgrade npm/node and start with a fresh Vite install next make sure every thing is up-to-date. Just to reiterate every thing installs fine just Vite does not see it. 

image.png.82282d7fee0ed6db12aab337af240929.png

Link to comment
Share on other sites

We have the same issue. Building the project with `Vite` works well using `gsap` but it does fail with the mentioned error message when using `gsap/business` via the private `gsap` registry. I suppose this *is* an issue with `Vite` and/or `rollup` not being able to resolve the modules properly, but so far we haven't found a solution either.

Link to comment
Share on other sites

  • 7 months later...

Vite seems to work here.

 

https://codesandbox.io/s/vite-react-forked-kqk1z?file=/src/App.jsx

 

If you're doing SSR, you might need to import from the UMD files from the dist folder.

import { ScrollTrigger } from "gsap/dist/ScrollTrigger";

 

Outside of that, all we can really suggest is to raise an issue with Vite. We have no control over how some 3rd party tool handles imports.

 

Link to comment
Share on other sites

  • 1 year later...

Updating this post with a recent issue/solution. You need to have the file extension .js to include properly in build.

	import { gsap } from 'gsap'
	import { DrawSVGPlugin } from 'gsap/dist/DrawSVGPlugin.js'
	gsap.registerPlugin(DrawSVGPlugin)

 

  • Thanks 3
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...