HotupdaterHot Updater
Integration Plugins

BugSnag

The `withBugsnag()` plugin for hot-updater enables automatic sourcemap upload to BugSnag during the update bundle build process.

Prerequisites

  • BugSnag Account: Sign up here if you don't have one.
  • API Key: Copy the API key of your project from your BugSnag dashboard.
  • Install the plugin:
npm install @hot-updater/bugsnag-plugin @bugsnag/cli --save-dev

Step 1: Wrap Your Build Plugin

Use withBugsnag() to wrap any compatible build plugin such as bare.

Once wrapped, sourcemaps will automatically be uploaded to BugSnag when running the hot-updater deploy process.

hot-updater.config.ts
import { bare } from "@hot-updater/bare";
import { withBugsnag } from "@hot-updater/bugsnag-plugin";
import { defineConfig } from "hot-updater";
import { config } from "dotenv";

config({ path: ".env.hotupdater" });

export default defineConfig({
  build: withBugsnag(
    bare({
      enableHermes: false, // or true, depending if you want to use it
      sourcemap: true, // Required for sourcemap upload
    }),
    {
      apiKey: process.env.BUGSNAG_API_KEY!, // Your BugSnag project API key
    },
  ),
  // .. your other config
});
hot-updater.config.ts
import { withBugsnag } from "@hot-updater/bugsnag-plugin";
import { defineConfig } from "hot-updater";
import { expo } from "@hot-updater/expo";

export default defineConfig({
  build: withBugsnag(
    expo({
      sourcemap: true, // Required for sourcemap upload
    }),
    {
      apiKey: process.env.BUGSNAG_API_KEY!, // Your BugSnag project API key
    },
  ),
  // .. your other config
});
hot-updater.config.ts
import { withBugsnag } from "@hot-updater/bugsnag-plugin";
import { defineConfig } from "hot-updater";
import { rock } from "@hot-updater/rock";

export default defineConfig({
  build: withBugsnag(
    rock({
      sourcemap: true, // Required for sourcemap upload
    }),
    {
      apiKey: process.env.BUGSNAG_API_KEY!, // Your BugSnag project API key
    },
  ),
  // .. your other config
});

Automatic Upload

When withBugsnag() wraps your build plugin, all generated sourcemaps are uploaded to BugSnag automatically during the hot-updater deploy process. Each upload is identified by a codeBundleId, which defaults to the bundle id hot-updater generates for the deploy.

Step 2: Set the codeBundleId in Your App

BugSnag matches errors from OTA-updated apps to the uploaded sourcemaps through the codeBundleId. Pass the current hot-updater bundle id when starting BugSnag:

App.tsx
import Bugsnag from "@bugsnag/react-native";
import { HotUpdater } from "@hot-updater/react-native";

Bugsnag.start({
  codeBundleId: HotUpdater.getBundleId(), 
});

Step 3: Deploy

Now, every time you deploy, sourcemaps will be automatically uploaded to BugSnag.

npx hot-updater deploy -i

On this page