Angular 如何在离子/角度项目中导入和使用GSAP？

我有一个新的爱奥尼亚项目（“空白”模板）。我已经运行了

npm安装gsap--save

这是我的

应用程序模块.ts

：

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';

import { TweenMax } from "gsap/all";

@NgModule({
  declarations: [
    MyApp,
    HomePage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    TweenMax,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { TweenMax } from "gsap/all";

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  constructor(
    public navCtrl: NavController,
    public TweenMax: TweenMax
  ) {

  }

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

}

这是我的

家。ts

：

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';

import { TweenMax } from "gsap/all";

@NgModule({
  declarations: [
    MyApp,
    HomePage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    TweenMax,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { TweenMax } from "gsap/all";

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  constructor(
    public navCtrl: NavController,
    public TweenMax: TweenMax
  ) {

  }

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

}

但我的应用程序出现以下错误：

运行时错误：无法解析TweenMax:（？，？，？）的所有参数。

---

这里发生了什么，为什么我会出现这个错误？我尝试了中的所有导入类型，每次都得到相同的结果。

GSAP TweenMax默认不提供定义文件

npm install --save-dev @types/greensock

组件：

declare var TweenMax: any;

参考：

突击检查样本：

---

关于爱奥尼亚：请参考

谢谢，但这仍然不起作用。本文引用了一个

angular.json

，它不在我的项目中，因为我使用的是Ionic。我已将类型定义添加到依赖项中，但它不会影响错误消息。我还尝试了

declare var

，没有luckFirst参数而不是字符串“.logo”，尝试传递nativeElement值“this.testRef.nativeElement”并不是这样，我可以注释掉整个TweenMax调用，但仍然会得到与我的问题相同的错误，您使用的版本是什么？是的，我已经阅读了该线程。但使用HTML导入似乎不太合适。应该有一种方法可以正确导入，它只是一个JS库