无法在Ionic 3应用程序中导入Amplitude SDK

时间:2019-04-22 16:15:52

标签: javascript node.js typescript ionic3 circular-dependency

我正在尝试使用Amplitude SDK从Ionic 3应用程序获取统计信息。但是,由于该应用程序是使用具有特定文件架构的TypeScript编写的,因此它不像official documentation那样简单。

但是,我发现the @types/amplitude-js package,并且我认为它可以解决我的所有问题。但是很不幸,当我使用ionic cordova run android --device在设备上编译应用程序时,该应用程序无法加载,并且出现以下错误消息:

Uncaught Error: Encountered undefined provider! 
Usually this means you have a circular dependencies (might be caused by using 'barrel' index.ts files.

*sigh*

注意:我运行ionic serve时也会出现此错误。

这就是我所做的步骤:

  • 我通过运行npm install --save @types/amplitude-js安装了@ types / amplitude-js。
  • 我通过运行npm install amplitude-js安装了原始的Amplitude SDK。我注意到有必要这样做,否则我的应用程序将不会仅使用@type包进行编译(这很有意义)。
  • 我在app.module.ts
  • 中添加了以下几行

import { AmplitudeClient } from 'amplitude-js';

[...]
@NgModule({
    [...]
    providers: [
        AmplitudeClient,
        [...]
    ]
});

  • 我还创建了一个AmplitudeProvider,它将管理我整个应用程序中的所有振幅事件:

import { Injectable } from '@angular/core';
import { HttpServiceProvider } from "../http-service/http-service";
import { AmplitudeClient } from 'amplitude-js';

/**
 * AmplitudeProvider
 * @description Handles Amplitude statistics
 */
@Injectable()
export class AmplitudeProvider {

  constructor(
    public http: HttpServiceProvider,
    public amplitude: AmplitudeClient
  ) {
    this.amplitude.init("MY_AMPLITUDE_KEY");
  }

  /**
   * logEvent
   * @description Logs an event in Amplitude
   * @param eventTitle Title of the event
   */
  public logEvent(title) {
      // Do things not relevant here
  }
  
}

我确定我的依赖项注入和/或导入中做错了什么,但我不知道是什么。而且我看不到任何循环依赖,因为amplitude-js包不是我制作的,也不导入我的任何提供程序。

在此先感谢任何将我指向正确方向的人!

1 个答案:

答案 0 :(得分:2)

AmplitudeClient is not a Ionic Provider, therefore, you can't import it and put in your Class constructor.

To use amplitude in your Provider you want to import amplitude. Your code should be similar to this.

import amplitude, { AmplitudeClient } from 'amplitude-js';

@Injectable()
export class AmplitudeProvider {

  private client: AmplitudeClient;

  constructor(
    public http: HttpServiceProvider,
    public database: DatabaseProvider
  ) {
    this.client = amplitude.getInstance();
    this.client.init("MY_AMPLITUDE_KEY");
  }
}