JavaScript

Installing Airbrake in a JavaScript application

Key Features

  • Easy and flexible installation options including npm and Yarn
  • Send uncaught errors to Airbrake or manually using a try/catch
  • Add custom parameters to your errors for more context
  • Private source map support
  • Control which errors you send with customizable filtering options

Supported frameworks

AngularJS

Angular

Express

JS In Rails

Legacy

Node.js

React

Redux

Svelte

Vue.js

Installation & Configuration

Using npm

npm install @airbrake/browser

Using Yarn

yarn add @airbrake/browser

Using CDN

Using <script> tag via jsdelivr:

<script src="https://cdn.jsdelivr.net/npm/@airbrake/browser"></script>

Using <script> tag via unpkg:

<script src="https://unpkg.com/@airbrake/browser"></script>

Additional Settings

Basic usage

First, initialize the notifier with the project ID and API key taken from Airbrake:

import { Notifier } from '@airbrake/browser';

const airbrake = new Notifier({
  projectId: 1,
  projectKey: 'REPLACE_ME',
  environment: 'production',
});

Then, you can send a textual message to Airbrake:

let promise = airbrake.notify(`user id=${user_id} not found`);
promise.then((notice) => {
  if (notice.id) {
    console.log('notice id', notice.id);
  } else {
    console.log('notify failed', notice.error);
  }
});

or report errors directly:

try {
  new Error('Hello from Airbrake!');
} catch(err) {
  airbrake.notify(err);
  throw err;
}

Alternatively, you can wrap any code which may throw errors using the wrap method:

let startApp = () => {
  new Error('Hello from Airbrake!');
};
startApp = airbrake.wrap(startApp);

// Any exceptions thrown in startApp will be reported to Airbrake.
startApp();

or use the call shortcut:

let startApp = () => {
  new Error('Hello from Airbrake!');
};

airbrake.call(startApp);

Troubleshoot

Installation and configuration is just the beginning. The airbrake-js notifier supports many other advanced uses and options including:

Please visit the airbrake-js GitHub repo for more usage and configuration examples.