Ionic

Instructions for Installing Purchases SDK for Ionic

Please refer to our documentation in Ionic Native Plugin documentation for installation instructions.

// Install Cordova plugin
ionic cordova plugin add cordova-plugin-purchases

// Install TypeScript wrapper
npm install @awesome-cordova-plugins/purchases

// Install Ionic Native core library (once per project)
npm install @awesome-cordova-plugins/core
// Install Cordova plugin
npm install cordova-plugin-purchases

// Install Ionic Native core library (once per project)
npm install @awesome-cordova-plugins/core --save

// Install TypeScript wrapper
npm install @awesome-cordova-plugins/purchases

// Update native platform project(s) to include newly added plugin
ionic cap sync

🚧

Note:

If you run into issues when running on Android, try going to Android Studio -> File -> Sync project with Gradle files.

Angular

Angular apps can use either Cordova or Capacitor to build native mobile apps. For Angular, the import path should end with /ngx.

import { Platform } from "@ionic/angular";
import { Purchases } from "@awesome-cordova-plugins/purchases/ngx";

constructor(public platform: Platform, private purchases: Purchases) {
    platform.ready().then(() => {
        this.purchases.setDebugLogsEnabled(true); // Enable to get debug logs
        this.purchases.setup("my_api_key", "my_app_user_id");
        this.purchases.configureWith({
            apiKey: "my_api_key",
            appUserID: "my_app_user_id"
        });
    }
}

React

Import the plugin object then use its static methods:

import { Purchases } from '@awesome-cordova-plugins/purchases';

const Tab1: React.FC = () => {
  Purchases.setDebugLogsEnabled(true);
  Purchases.purchases.configureWith({
    apiKey: "my_api_key",
    appUserID: "my_app_user_id"
  });
  return (
    <IonPage>
      <IonHeader>
        <IonToolbar>
          <IonTitle>Tab 1</IonTitle>
        </IonToolbar>
      </IonHeader>
      <IonContent>
        <IonButton onClick={openScanner}>Scan barcode</IonButton>
      </IonContent>
    </IonPage>
  );
};