You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: includes/debug-ids/index.mdx
+28-9Lines changed: 28 additions & 9 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,9 +1,9 @@
1
-
---
2
-
title: What are Debug IDs
3
-
sidebar_order: 7
4
-
---
5
-
6
-
This documentation provides an in-depth look at Debug IDs, explaining how they work and why Sentry recommends using them. Visit [Uploading Source Maps](https://docs.sentry.io/platforms/javascript/guides/react/sourcemaps/uploading/) if you're looking for our guides on how to upload source maps.
1
+
<PlatformSectionnotSupported={["react-native"]}>
2
+
This documentation provides an in-depth look at Debug IDs, explaining how they work and why Sentry recommends using them. Visit [Uploading Source Maps](/platforms/javascript/guides/react/sourcemaps/uploading/) if you're looking for our guides on how to upload source maps.
3
+
</PlatformSection>
4
+
<PlatformSectionsupported={["react-native"]}>
5
+
This documentation provides an in-depth look at Debug IDs, explaining how they work and why Sentry recommends using them. Visit [Uploading Source Maps](/platforms/react-native/sourcemaps/uploading/) if you're looking for our guides on how to upload source maps.
6
+
</PlatformSection>
7
7
8
8
## Introduction
9
9
@@ -29,7 +29,7 @@ Inspired by approaches in native language ecosystems, Debug IDs are globally uni
29
29
30
30
When using sentry-cli or Sentry plugins for Webpack, Vite, or Rollup, Debug IDs are deterministically generated based on the source file contents. Note that deterministic Debug IDs for esbuild are not currently supported.
31
31
32
-
This approach is Sentry's recommended and most reliable method for associating minified JavaScript files with their original source code, making it easier to trace errors back to their source. Because debug IDs will generally change across releasess if the file content is changed **creating a release is no longer required**. Release names were previously used to disambiguate sourcemaps with the same name across deployments.
32
+
This approach is Sentry's recommended and most reliable method for associating minified JavaScript files with their original source code, making it easier to trace errors back to their source. Because debug IDs will generally change across releases if the file content is changed **creating a release is no longer required**. Release names were previously used to disambiguate sourcemaps with the same name across deployments.
33
33
34
34
<Alert>
35
35
@@ -39,25 +39,40 @@ If you want to learn more about the rationale behind Debug IDs, we suggest takin
To use Debug IDs, ensure that you're using **Sentry's SDK version 7.47 or higher**. Once you're on a supported version, follow the steps outlined below:
For Debug IDs with Next.js, you’ll need **Sentry's SDK version 8.0.0 or higher**. Once you're on a supported version, follow the steps outlined below:
47
47
</PlatformSection>
48
+
<PlatformSectionsupported={["react-native"]}>
49
+
For Debug IDs with React Native, you’ll need **Sentry's React Native SDK version 5.16.0 or higher**. Once you're on a supported version, follow the steps outlined below:
50
+
</PlatformSection>
48
51
49
52
53
+
<PlatformSectionnotSupported={["react-native"]}>
50
54
1.**A globally unique Debug ID is generated**: During the build process, if you are using one of Sentry's Bundler Plugins or Sentry CLI a Debug ID is generated, which is globally unique and ideally deterministic.
51
55
52
56
2.**Debug IDs are embedded in minified files**: Each minified JavaScript file includes a special comment, such as `//# debugId=DEBUG_ID`, where `DEBUG_ID` is the unique identifier generated in the previous step.
57
+
</PlatformSection>
58
+
<PlatformSectionsupported={["react-native"]}>
59
+
1.**A globally unique Debug ID is generated**: During the build process, if you are using [Sentry's Metro Plugin](/platforms/react-native/manual-setup/metro/) a Debug ID is generated, which is globally unique and ideally deterministic.
60
+
61
+
2.**Debug IDs are embedded in the output files**: Each JavaScript file includes a special comment, such as `//# debugId=DEBUG_ID`, where `DEBUG_ID` is the unique identifier generated in the previous step.
62
+
</PlatformSection>
53
63
54
64
3.**The same Debug ID is added to source maps**: Source maps also include the same Debug ID as a new attribute, linking the minified JavaScript file to its corresponding source map.
55
65
56
66
4.**Stack traces in Sentry link the Debug ID**: When an error occurs, Sentry's event contains the Debug ID, which allows Sentry to automatically link the error to the correct source map. This ensures the stack trace is resolved back to the original source code, providing you with clearer and more accurate debugging information—even if the JavaScript has been minified or transformed.
57
67
58
68
### Why use Debug IDs to uniminify your code?
59
69
60
-
Unminifying your code is essential for effective debugging. While there are other [legacy ways](https://docs.sentry.io/platforms/javascript/sourcemaps/troubleshooting_js/legacy-uploading-methods/) to achieve this at Sentry, using **Debug IDs are recommended by Sentry** as it is the most reliable method. By unminifying your code, you get much clearer stack traces when errors occur. Instead of seeing obfuscated code, you'll see the exact code you originally wrote, making it far easier to understand and resolve issues. Below are examples that demonstrates the difference:
70
+
<PlatformSectionnotSupported={["react-native"]}>
71
+
Unminifying your code is essential for effective debugging. While there are other [legacy ways](/platforms/javascript/sourcemaps/troubleshooting_js/legacy-uploading-methods/) to achieve this at Sentry, using **Debug IDs are recommended by Sentry** as it is the most reliable method. By unminifying your code, you get much clearer stack traces when errors occur. Instead of seeing obfuscated code, you'll see the exact code you originally wrote, making it far easier to understand and resolve issues. Below are examples that demonstrates the difference:
72
+
</PlatformSection>
73
+
<PlatformSectionsupported={["react-native"]}>
74
+
Unminifying your code is essential for effective debugging. While there are other [legacy ways](/platforms/react-native/sourcemaps/troubleshooting/legacy-uploading-methods/) to achieve this at Sentry, using **Debug IDs are recommended by Sentry** as it is the most reliable method. By unminifying your code, you get much clearer stack traces when errors occur. Instead of seeing obfuscated code, you'll see the exact code you originally wrote, making it far easier to understand and resolve issues. Below are examples that demonstrates the difference:
@@ -78,3 +93,7 @@ Since you might still want to know to which release an specific Debug ID is conn
78
93
The new Debug ID format supports a new kind of association to a `release` and optionally `dist`, known as weak release association. This type of association **will not require the creation of a `release`** before uploading source maps and will consequently allow the creation of a `release` as a separate step down the pipeline.
79
94
80
95
With an associated `release` and optionally `dist` you will be able to quickly go to the Debug ID from your `release` in Sentry, without having to worry about which Debug ID was used for your errors.
96
+
97
+
<PlatformSectionsupported={["react-native"]}>
98
+
This is done by the Sentry Xcode and Sentry Gradle plugins automatically during the React Native application build process.
0 commit comments