Ionic

To use Sentry with Ionic you have to add sentry-cordova as a dependency to you package.json.

First run npm i --save sentry-cordova and make sure you already added the platforms you want to support with ionic cordova platform add ios and/or ionic cordova platform add android.

After that it’s important to run cordova plugin add sentry-cordova without the ionic wrapper.

When building your app with ionic for production make sure you have sourcemaps enabled. You have to add this to your package.json:

"config": {
    "ionic_generate_source_map": "true"
}

Otherwise we are not able to upload sourcemaps to Sentry.

To setup Sentry in your codebase, add this to your app.module.ts:

import * as Sentry from 'sentry-cordova';

Sentry.init({ dsn: '___PUBLIC_DSN___' });

In order to also use the Ionic provided IonicErrorHandler, we need to add SentryIonicErrorHandler:

import { IonicErrorHandler } from 'ionic-angular';

import * as Sentry from 'sentry-cordova';

class SentryIonicErrorHandler extends IonicErrorHandler {
  handleError(error) {
    super.handleError(error);
    try {
      Sentry.captureException(error.originalError || error);
    } catch (e) {
      console.error(e);
    }
  }
}

Then change the @NgModule{providers:[]} in app.module.ts to:

@NgModule({
    ...
    providers: [
        StatusBar,
        SplashScreen,
        // {provide: ErrorHandler, useClass: IonicErrorHandler} remove this, add next line
        {provide: ErrorHandler, useClass: SentryIonicErrorHandler}
    ]
})
In this guide