Welcome to Highlight
Getting Started
Overview
Backend / Server
Client / Frontend
Fullstack Frameworks
Tips
Content-Security-Policy
Local Development
Monkey Patches
Performance Impact
Proxying Highlight
Session Search Deep Linking
Troubleshooting
Upgrading Highlight
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
Grouping Errors
Sourcemaps
Versioning Errors
Product Features
Alerts
Analytics
Canvas
Comments
Environments
Frontend Observability
Keyboard Shortcuts
Performance Data
Segments
Session Search
Team Management
User Feedback
Web Vitals
WebGL
Integrations
Amplitude Integration
Clearbit Integration
Electron Integration
Front Plugin
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
Menu
Docs / 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. This is the same version string your provide as version to H.init(). This ensures that we're always using the same set of sourcemaps for your current bundle. The default value is the current Git hash.

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.