GSAP in Ionic project

Question

How can Import the GSAP library into an Ionic project. Just using npm install gsap don't work when I import through

import { TweenMax, TimelineMax} from "gsap";

I use typescript. Thanks

Answer 1

You don't need Typings for it. I've used it in several projects (all of them Typescript):

1. Put the GSAP libraries you want to use in assets/javascripts

2. Include your file in your src/index.html file like this:

   <script src="assets/javascripts/TweenMax.min.js"></script>

3. Right after your imports, declare the GSAP objects like this (in all the views you will be using them):

   /*
     Normal imports here..
   */
   import { LoginPage } from "../login/login";
   
   declare var TimelineMax: any;        
   declare var TweenMax: any;
   declare var Power1: any;
   
   @Component({
     selector: 'page-profile',
     templateUrl: 'profile.html',
     providers: [Data, Api, DatePipe]
   })
   
   export class ProfilePage {
     ...
   

4. Use like normal:

   ...
   ionViewDidLoad(){
     TweenMax.from(".logo", .5, { 
       opacity: 0,
       y: -72,
       ease:  Power1.easeOut
     });
   }
   ...