Importing GSAP-3 Ease with Webpack
Using GSAP ease with Webpack / babel is not straightforward. Webpack needs to know independent references to link and optimize javascript.
Example
The following example leads to error when using with webpack:
import gsap from 'gsap'
gsap.to(elment, { duration:1, rotation: 180 ease: Power0.easeNone })
Error message
The following error message is displayed in webpack build:
'Power0' is not defined
Solution
Gsap (gsap
) is a module or namespace. It works if you import the whole module. Just change the way you import Gsap and use Gsap.<Ease>
.
import * as Gsap from 'gsap'
Gsap.gsap.to(elment, { duration:1, rotation: 180 ease: Gsap.Power0.easeNone })