npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@honeybadger-io/react-native

v6.4.0

Published

Honeybadger.io for React Native.

Downloads

863

Readme

Honeybadger for React Native

Node CI npm version npm dm npm dt

A React Native library for integrating Honeybadger into your React Native iOS and Android apps.

Installation

From the root directory of your React Native project, add @honeybadger-io/react-native as a dependency:

npm install "@honeybadger-io/react-native"
cd ios && pod install

The iOS step is required to properly add the library to the Xcode project through CocoaPods. Android doesn't require a separate step.

Initialization

Add the following to your App.js file to initialize the Honeybadger library.

import Honeybadger from "@honeybadger-io/react-native";

export default function App() {
  Honeybadger.configure({
    apiKey: '[ YOUR API KEY HERE ]'
  })
  // ...
}

You can log into your Honeybadger account to obtain your API key.

Configuration

See the Configuration Reference for a full list of config options.

Usage

Uncaught iOS, Android, and JavaScript errors will be automatically reported to Honeybadger by default.

You can also report errors yourself using Honeybadger.notify().

Error reports can be customized, for example by using Honeybadger.setContext(), Honeybadger.addBreadcrumb(), and Honeybadger.beforeNotify().

Limitations

Some native errors on Android may not be recorded if they cause an immediate crash of the app before the notice makes it to Honeybadger.

Source Maps

To generate and upload source maps to Honeybadger, use the following command:

npx honeybadger-upload-sourcemaps --apiKey <your project API key> --revision <build revision>

The --apiKey param is your Honeybadger API key for the project. The --revision param should match the revision param of the Honeybadger.init call inside your application. This is done so that reported errors are correctly matched up against the generated source maps.

As of version 0.70, React Native uses Hermes as the default JavaScript engine. The source maps tool assumes that your project uses Hermes. If you are building against an earlier version of React Native, or are explicitly not using Hermes, add the --no-hermes flag to the source maps tool, like so:

npx honeybadger-upload-sourcemaps --no-hermes --apiKey <your project API key> --revision <build revision>

If you just want to generate the source maps without uploading them to Honeybadger, you can use the --skip-upload flag.

npx honeybadger-upload-sourcemaps --skip-upload --apiKey <your project API key> --revision <build revision>

Example Projects

The examples directory contains two minimal React Native projects, demonstrating the use of the Honeybadger library. One was created using the React Native CLI Quickstart instructions and one using the Expo Go Quickstart instructions from react-native. Please review those instructions, as you may need to install Android Studio, Xcode, etc.

react-native-cli

npm install
npm run ios:install
npm start

In a new shell:

npm run ios

or

npm run android

If you want to test a release (ie prod) build, use

npm run ios:release

or

npm run android:release

expo-app

Do not use npx expo start, since this relies on Expo Go, which does not support custom native code. Instead, use the following commands:

npm install
npm run ios

or

npm install
npm run android

When the app opens, enter your API key, press "Configure", and then test your setup by using the button to throw an error.

If you want to test a release (ie prod) build, use

npm run ios:release

or

npm run android:release

Development workflow

When developing the react-native package and testing against the example projects, you will need to change the dependency in the example project's package.json. Rather than "@honeybadger-io/react-native": "latest", you'll want to generate a tarball of the react-native package and install it. For example:

In the react-native folder:

npm run build && npm pack

This will generate a tarball. Install it in an example project by updating package.json, for example:

"@honeybadger-io/react-native": "file:../../honeybadger-io-react-native-5.1.6.tgz"

Then run npm install within the example project.

If you notice that your changes are not being picked up, there may be a caching issue. You can bust this by renaming the tarball to a unique name and re-installing it.

License

The Honeybadger React Native library is MIT-licensed. See the MIT-LICENSE file in this folder for details.