Source URL: https://docs.sentry.io/platforms/javascript/guides/nextjs/sourcemaps/uploading/esbuild

esbuild | Sentry for Next.js

This guide assumes you’re using a Sentry SDK version 7.47.0 or higher. If you’re on an older version and you want to upload source maps, we recommend upgrading your SDK to the newest version.

You can use the Sentry esbuild plugin to automatically create releases and upload source maps to Sentry when bundling your app.

Automatic Setup

The easiest way to configure source map uploading with esbuild is by using the Sentry Wizard:

npx @sentry/wizard@latest -i sourcemaps

The wizard will guide you through the following steps:

Logging into Sentry and selecting a project
Installing the necessary Sentry packages
Configuring your build tool to generate and upload source maps
Configuring your CI to upload source maps

If you want to configure source map uploading with esbuild manually, follow the steps below.

Manual Setup

Install the Sentry esbuild plugin:

npm install @sentry/esbuild-plugin --save-dev

Configure

To upload source maps you have to configure an Organization Token.

Alternatively, you can also use a Personal Token, with the “Project: Read & Write” and “Release: Admin” permissions.

Auth tokens can be passed to the plugin explicitly with the authToken option, with a SENTRY_AUTH_TOKEN environment variable, or with an .env.sentry-build-plugin file (don’t forget to add it to your .gitignore file, as this is sensitive data) in the working directory when building your project. We recommend you add the auth token to your CI/CD environment as an environment variable.

Learn more about configuring the plugin in our Sentry esbuild Plugin documentation.

.env.sentry-build-plugin

SENTRY_AUTH_TOKEN=___ORG_AUTH_TOKEN___

Example:

esbuild.config.js

const { sentryEsbuildPlugin } = require("@sentry/esbuild-plugin");

require("esbuild").build({
  sourcemap: "hidden", // Source map generation must be turned on ("hidden", true, etc.)
  plugins: [
    // Put the Sentry esbuild plugin after all other plugins
    sentryEsbuildPlugin({
      org: "___ORG_SLUG___",
      project: "___PROJECT_SLUG___",
      authToken: process.env.SENTRY_AUTH_TOKEN,

      sourcemaps: {
        // As you're enabling client source maps, you probably want to delete them after they're uploaded to Sentry.
        // Set the appropriate glob pattern for your output folder - some glob examples below:
        filesToDeleteAfterUpload: [
          "./**/*.map",
          ".*/**/public/**/*.map",
          "./dist/**/client/**/*.map",
        ],
      },
    }),
  ],
});

Generating source maps may expose them to the public, potentially causing your source code to be leaked. You can prevent this by configuring your server to deny access to .js.map files, or by using Sentry Esbuild Plugin’s sourcemaps.filesToDeleteAfterUpload option to delete source maps after they’ve been uploaded to Sentry.

The Sentry esbuild plugin doesn’t upload source maps in watch-mode/development-mode. We recommend running a production build to test your configuration.