Run trial GSAP plugins on CodeSandBox

[iant1359]

Hello,

Nice to meet you all. I'm new to GreenSock and I'm looking for a way to set up and run this demo https://codepen.io/GreenSock/pen/rOjeRq on CodeSandBox with the trial MorphSVGPlugin URL. Still, I cannot find anyway to run it.

I'm using the Gatsby starter template. https://codesandbox.io/s/testgreensock-11cr1

Here are the few things that I've tried:

- Add the MorphSVGPlugin3.min.js as an external URL

- And try this but get error "Can't resolve 'gsap/MorphSVGPlugin' or 

import { MorphSVGPlugin } from "gsap/MorphSVGPlugin"

 

gsap.registerPlugin(MorphSVGPlugin)

- I also tried to add the url to Helmet

But it still does not work.

Please anyone can help me set this up?

 

See the Pen rOjeRq by GreenSock (@GreenSock) on CodePen

[ZachSaucier]

Hey iant1359. Using regular React you can just load it via a script tag and then make sure to register it. I'm not sure how to do it in Gatsby. @Rodrigo Do you happen to know?

[Rodrigo]

Mhh... I'm not a big fan of Gatsby, too convoluted IMHO. Next is quite simpler to use and if you want to use GraphQL you can tap Apollo Server super easy. With that out of my chest I thought that the SSR API should be the way to achieve it, but in codesandbox I can't get it to work with any script I try:

 

https://www.gatsbyjs.com/docs/ssr-apis/#onRenderBody

 

I don't know if this is a codesandbox thing or what because I haven't tried locally. You could try locally adding a script tag in the head for example of axios and check if it works. If it does then the issue is on codesandbox, otherwise I have no idea how to do it in codesandbox. Another alternative that codesandbox doesn't give is access to the html.js file which is another alternative, as far as I know.

 

Finally codesandbox has a discord channel, you can ask there.

Scratch that, they used to have a discord channel, perhaps create an issue in github or contact their email support.

 

Sorry I can't be of more help.

 

Happy Tweening!!!