I'm trying to get TimeLineMax to work in my Angular 5 project and can't figure out what's not being done. I originally installed the npm package available on the gethub page and found this article https://teropa.info/blog/2016/12/12/graphics-in-angular-2.html#greensock showing how to use it in the OnInit lifecycle and this stackoverflow post https://stackoverflow.com/questions/37135894/using-tweenmax-in-angular2-project which touches on the issue of gtting it up and working. So far I imported it into my component like this
import { TimeLineMax } from 'gsap';
and just to try it out I have this in my component class.
ngOnInit(){
this.layerAnimation();
}
layerAnimation(){
let anime: TimeLineMax = new TimeLineMax();
anime.from('.redLayer2', 1, {x: -200, opacity: 0});
return anime;
}
Nothing is happening. I've tried adding it to the main.ts file as originally shown in the article, I tried using the @ViewChild method, switched from using that to an ID to a Class, nothing works. I don't know what else to do and really can't find much info on using this with Angular and Typescript. Can anyone help shed light on this?
UPDATE
I created a demo on StackBlitz after fixing the typos with no success and ironically the demo works. I tried re-installing gsap and the animation still isn't working.
https://stackblitz.com/edit/gsap-demo?file=app/app.component.ts
