Star us on GitHub
Star
Company
Open Source
Mission & Values
Getting Started
Overview
Fullstack Mapping
Backend / Server
Frontend / Client
Fullstack Frameworks
Session Replay
Console Messages
HTML iframe Recording
Identifying Users
Live Mode
Network DevTools
Privacy
Rage Clicks
Recording Network Requests and Responses
Session Sharing
Session Shortcut
Tracking Events
Versioning Sessions
Error Monitoring
Error Sharing
Grouping Errors
Sourcemaps
Versioning Errors
Product Features
Alerts
Analytics
Canvas
Comments
Cross Origin Iframe Recording
Digests
Environments
Frontend Observability
Keyboard Shortcuts
Performance Data
Segments
Session Search
Team Management
User Feedback
Web Vitals
WebGL
Integrations
Amplitude Integration
Clearbit Integration
ClickUp Integration
Discord Integration
Electron Support
Front Plugin
Height Integration
Intercom Integration
Linear Integration
Mixpanel Integration
React.js Integration
Segment Integration
Sentry Integration
Slack Integration
Vercel Integration
highlight.run Changelog
5.0.0
5.0.1
5.1.0
5.1.1
5.1.2
5.1.3
5.1.4
5.1.5
5.1.6
5.1.7
5.1.8
5.2.0
5.2.1
5.2.2
5.2.3
Tips
Content-Security-Policy
Local Development
Monkey Patches
Performance Impact
Proxying Highlight
Session Search Deep Linking
Troubleshooting
Upgrading Highlight
Menu
Docs / Welcome to Highlight / Error Monitoring / Sourcemaps

Sourcemaps

Should I continue reading?

If you publicly deploy sourcemaps with your application then you do not need this guide. This guide is for applications that don't ship sourcemaps with their application.

When debugging an error in Highlight, it might be useful to get a stack trace from the original file in your codebase (rather than a minified file) to help understand what is going wrong. In order to do this, Highlight needs access to the sourcemaps from your codebase. Sourcemaps can be sent to Highlight in your CI/CD process.

Sending Sourcemaps to Highlight

The Highlight sourcemap-uploader can be used during your CI/CD process. Here's an example of using it:

#!/bin/sh # Build the app yarn build # Upload sourcemaps to Highlight # Add --appVersion "..." if you provide a version value in your H.init call. npx --yes @highlight-run/sourcemap-uploader upload --apiKey ${YOUR_ORG_API_KEY} --path ./build # Delete sourcemaps to prevent them from being deployed find build -name '*.js.map' -type f -delete # Deploy the app ./custom-deploy-script
Copy
Sourcemap-uploader Arguments
apiKey

The API key for your project. You can find this in the project settings.

path

The path that Highlight will use to send .map files. The default value is ./build.

appVersion

The version of your current deployment. Please provide the same version value as the value you provide for version in H.init(). This ensures that we're always using the same set of sourcemaps for your current bundle. If omitted, sourcemaps are uploaded as unversioned (make sure H.init() does not have a version option provided).

Generating Sourcemaps

To use the Highlight sourcemap-uploader , you need to be generating sourcemaps for your project. Exactly how to do this depends on your target environment and javascript configuration. Bundlers like babel, webpack, esbuild, or rollup all provide different ways to enable sourcemap generation. Refer to documentation for your specific bundler to generate production-ready sourcemaps or reach out if you need more help!

Electron App Sourcemaps

Although your electron app configuration may vary, many will chose to use webpack to generate sourcemaps. Refer to the general webpack sourcemap documentation as well as this useful reference to configure your build.