Source maps - Introduction

The problem

In production, your JS bundle is minified into a single index.android.bundle file (or iOS). A stack trace looks like:

TypeError: undefined is not an object
  at index.android.bundle:3:18745
  at index.android.bundle:3:21302
  at index.android.bundle:1:9412

Impossible to know where it crashed.

With source maps

Metro generates a .map file that maps each bundle position to the original position. Pionne resolves this server-side at ingest, and you see:

TypeError: undefined is not an object
  at CheckoutScreen.tsx:42:18 in handlePay
  at Button.tsx:18:5 in onPress
  at App.tsx:12:3 in render

How it works

Metro generates a .map at EAS build (or local).
You upload the .map to Pionne, identified by (project_id, release, platform).
The SDK sends the event with its release and platform.
The Pionne server finds the .map, deminifies each frame, and stores the readable stack.

Identify a build

The triplet matching an event to a sourcemap:

Field	SDK source	Example
`project_id`	`pio_live_...` token	inferred server-side
`release`	`Pionne.init({ release })`	`1.0.0`
`platform`	Auto via `Platform.OS`	`ios` or `android`

The release must match exactly between the SDK and the sourcemap upload.

Two ways to upload

EAS Build (recommended) → auto setup in one command.
Manual build / custom CI → manual upload with the CLI.

Verify it works

After an upload, trigger a crash in prod. In the dashboard, the event should show file paths like .tsx/.ts and not index.android.bundle. If it doesn’t:

Check that release matches exactly.
Check that the platform matches (iOS vs Android).
Check the upload status in Settings → Source maps in the app.