-
-
Notifications
You must be signed in to change notification settings - Fork 1.6k
Nextjs source map doc updates #14433
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Merged
Merged
Changes from all commits
Commits
Show all changes
8 commits
Select commit
Hold shift + click to select a range
bf143ff
Update Next.js sourcemaps primer content
d7ce7b0
updating the nextjs source maps primer and overview
9204e9e
Update platform-includes/sourcemaps/overview/javascript.nextjs.mdx
sfanahata e3f9989
Update platform-includes/sourcemaps/overview/javascript.nextjs.mdx
sfanahata dd22b1b
adding arcade
7cac867
remove nodejs blog post
d5049db
adding note about adding auth to your CI
10f895c
updating description
File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change | ||||
---|---|---|---|---|---|---|
@@ -0,0 +1,69 @@ | ||||||
### Manual Configuration | ||||||
If you installed the SDK manually or the wizard failed, follow the steps below to manually configure source maps upload. | ||||||
|
||||||
#### 1. Configure Source Maps Upload | ||||||
|
||||||
To automatically upload source maps, you need to provide your Sentry auth token, organization, and project slugs in your Next.js configuration: | ||||||
|
||||||
<OrgAuthTokenNote /> | ||||||
|
||||||
**Make sure you add your auth token to your CI, if you are using one to deploy your application.** | ||||||
|
||||||
Add your auth token to your environment: | ||||||
|
||||||
```bash {filename:.env.local} | ||||||
SENTRY_AUTH_TOKEN=___ORG_AUTH_TOKEN___ | ||||||
``` | ||||||
|
||||||
```javascript {filename:next.config.js} | ||||||
const { withSentryConfig } = require("@sentry/nextjs"); | ||||||
|
||||||
module.exports = withSentryConfig( | ||||||
{ | ||||||
// your existing Next.js config | ||||||
}, | ||||||
{ | ||||||
org: "___ORG_SLUG___", | ||||||
project: "___PROJECT_SLUG___", | ||||||
authToken: process.env.SENTRY_AUTH_TOKEN, | ||||||
} | ||||||
); | ||||||
``` | ||||||
|
||||||
#### 2. Source Map Options | ||||||
|
||||||
Configure source map behavior using the [source maps options](/platforms/javascript/guides/nextjs/configuration/build/#source-maps-options) in your Next.js config: | ||||||
|
||||||
```javascript {11-16} {filename:next.config.js} | ||||||
const { withSentryConfig } = require("@sentry/nextjs"); | ||||||
|
||||||
module.exports = withSentryConfig( | ||||||
{ | ||||||
// your existing Next.js config | ||||||
}, | ||||||
{ | ||||||
org: "___ORG_SLUG___", | ||||||
project: "___PROJECT_SLUG___", | ||||||
authToken: process.env.SENTRY_AUTH_TOKEN, | ||||||
sourcemaps: { | ||||||
disable: false, // Enable source maps (default: false) | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
|
||||||
assets: ["**/*.js", "**/*.js.map"], // Specify which files to upload | ||||||
ignore: ["**/node_modules/**"], // Files to exclude | ||||||
deleteSourcemapsAfterUpload: true, // Security: delete after upload | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. We should mention that this is true by default |
||||||
}, | ||||||
} | ||||||
); | ||||||
``` | ||||||
### Turbopack Considerations | ||||||
|
||||||
**Important:** The Sentry SDK doesn't yet fully support Turbopack production builds (`next build --turbopack`) as Turbopack production builds are still in alpha. | ||||||
|
||||||
- **Turbopack dev mode** (`next dev --turbopack`) is fully supported for Next.js 15.3.0+ | ||||||
- **Turbopack production builds** are not currently supported for source map upload | ||||||
- If you're using Turbopack, remove the `--turbo` flag for production builds until full support is available | ||||||
|
||||||
Check the latest information on [Sentry's support for Turbopack on GitHub](https://github.com/getsentry/sentry-javascript/issues/8105). | ||||||
|
||||||
### Troubleshooting | ||||||
|
||||||
If you're experiencing issues with source maps, see [Troubleshooting Source Maps](/platforms/javascript/guides/nextjs/sourcemaps/troubleshooting_js/). |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,11 @@ | ||
`@sentry/nextjs` will generate and upload source maps automatically, in order to enable errors to have readable stack traces. | ||
`@sentry/nextjs` will generate and upload source maps automatically. You must have source maps enabled in order to have readable stack traces. | ||
|
||
To upload source maps, the `@sentry/nextjs` SDK uses the Sentry webpack plugin under the hood. See the [Build Options](../configuration/build/#source-maps-options) page and the Sentry [webpack plugin documentation](https://www.npmjs.com/package/@sentry/webpack-plugin) for more details. If you are using Vercel, then you can also use the [Vercel integration](/organization/integrations/deployment/vercel/) to upload source maps during deployments automatically. | ||
The easiest way to configure uploading source maps is by using the [Sentry Wizard](/platforms/javascript/guides/nextjs/#step-1-install). | ||
|
||
The `@sentry/nextjs` SDK uses the Sentry webpack plugin under the hood to upload source maps. See the [Build Options](../configuration/build/#source-maps-options) page and the Sentry [webpack plugin documentation](https://www.npmjs.com/package/@sentry/webpack-plugin) for more details. If you are using Vercel, then you can also use the [Vercel integration](/organization/integrations/deployment/vercel/) to upload source maps during deployments automatically. | ||
|
||
**Note:** Source maps are only generated and uploaded during **production builds** (`next build`). Development builds (`next dev`) do not generate source maps for upload. | ||
|
||
See how uploading source maps lets you see the exact line of code that caused an error: | ||
|
||
<Arcade src="https://demo.arcade.software/OFrHpZUU739XKR8qUiEP?embed" /> |
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Should we mention somewhere here that everything below is optional?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good call!