---
title: "Source Maps"
description: "Upload your source maps to Sentry to enable readable stack traces in your errors."
url: https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps/
---

# Source Maps | Sentry for Nuxt

`@sentry/nuxt` uses the [Sentry Vite Plugin](https://www.npmjs.com/package/@sentry/vite-plugin) and the [Sentry Rollup Plugin](https://www.npmjs.com/package/@sentry/rollup-plugin) to generate and upload source maps automatically. This means that when you run a production build (`nuxt build`), source maps will be generated and uploaded to Sentry, so that errors in Sentry will contain readable stack traces.

## [Configure Source Maps Upload](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps.md#configure-source-maps-upload)

To automatically upload source maps, you need to provide your Sentry auth token, your organization, and project slugs to the `sentry` options in your Nuxt config:

`nuxt.config.ts`

```javascript
export default defineNuxtConfig({
  modules: ["@sentry/nuxt/module"],

  sentry: {
    org: "___ORG_SLUG___",
    project: "___PROJECT_SLUG___",
    authToken: "___ORG_AUTH_TOKEN___",
  },

});
```

**Note:** Source maps are only generated and uploaded during **production builds** (`nuxt build`). Development builds (`nuxt 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:

### [Enabling Client-side Source Map Generation](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps.md#enabling-client-side-source-map-generation)

To enable client-side source maps, you need to do so explicitly. Nuxt applies default [source map settings](https://nuxt.com/docs/api/nuxt-config#sourcemap), and the Sentry Nuxt Module respects these when they are defined.

To enable client-side source map generation, add the following to your Nuxt configuration:

`nuxt.config.ts`

```javascript
export default defineNuxtConfig({

  sourcemap: { client: "hidden" },


  sentry: {

    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",
        ".output/**/public/**/*.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 Vite Plugin's `sourcemaps.filesToDeleteAfterUpload`](https://www.npmjs.com/package/@sentry/vite-plugin#sourcemapsfilestodeleteafterupload) option to delete source maps after they've been uploaded to Sentry.

The `hidden` option functions the same as `true`, by enabling source map generation. However, it also suppresses the source map reference comments that normally appear at the end of each generated file in the build output. This option keeps the source maps available without exposing their references in the files.

When you open your browser's developer tools, the browser tries to fetch source maps using the reference comments found in bundled files. If the source maps are uploaded to Sentry and removed from the client side, these references cause 404 errors in the developer tools. The `hidden` option stops these comments from being generated, preventing browsers from trying to fetch missing files and avoiding unnecessary errors.

## [Uploading Source Maps in a Nuxt Project](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps.md#uploading-source-maps-in-a-nuxt-project)

`@sentry/nuxt` will generate and upload source maps automatically during production builds, so that errors in Sentry contain readable stack traces.

### [Automatic Setup](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps.md#automatic-setup)

The easiest way to configure uploading source maps is by using the [Sentry Wizard](https://docs.sentry.io/platforms/javascript/guides/nuxt.md#step-1-install).

### [Manual Configuration](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps.md#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](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps.md#1-configure-source-maps-upload)

To automatically upload source maps, you need to provide your Sentry auth token, organization, and project slugs in your Nuxt configuration:

**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:

`.env`

```bash
SENTRY_AUTH_TOKEN=___ORG_AUTH_TOKEN___
```

Using environment variables in Vite configs

Vite doesn't automatically load `.env` files into `process.env` when evaluating the config file. If you store your auth token in a `.env` file and want to access it via `process.env.SENTRY_AUTH_TOKEN`, use Vite's [`loadEnv`](https://vite.dev/guide/api-javascript#loadenv) helper:

`vite.config.js`

```javascript
import { defineConfig, loadEnv } from "vite";

export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd(), "");

  return {
    plugins: [
      sentryVitePlugin({
        authToken: env.SENTRY_AUTH_TOKEN,
        // ...
      }),
    ],
  };
});
```

Alternatively, use a `.env.sentry-build-plugin` file, which the Sentry plugin reads automatically.

`nuxt.config.ts`

```javascript
export default defineNuxtConfig({
  modules: ["@sentry/nuxt/module"],
  sentry: {
    org: "___ORG_SLUG___",
    project: "___PROJECT_SLUG___",
    authToken: process.env.SENTRY_AUTH_TOKEN,
  },
});
```

#### [2. Enable Client-side Source Map Generation](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps.md#2-enable-client-side-source-map-generation)

To enable client-side source maps, you need to do so explicitly. Nuxt applies default [source map settings](https://nuxt.com/docs/api/nuxt-config#sourcemap), and the Sentry Nuxt Module respects these when they are defined.

To enable client-side source map generation, add the following to your Nuxt configuration:

`nuxt.config.ts`

```javascript
export default defineNuxtConfig({
  sourcemap: { client: "hidden" },
});
```

The `hidden` option functions the same as `true`, by enabling source map generation. However, it also suppresses the source map reference comments that normally appear at the end of each generated file in the build output. This option keeps the source maps available without exposing their references in the files.

When you open your browser's developer tools, the browser tries to fetch source maps using the reference comments found in bundled files. If the source maps are uploaded to Sentry and removed from the client side, these references cause 404 errors in the developer tools. The `hidden` option stops these comments from being generated, preventing browsers from trying to fetch missing files and avoiding unnecessary errors.

#### [3. Source Map Options](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps.md#3-source-map-options)

Configure source map behavior in your Nuxt config:

`nuxt.config.ts`

```javascript
export default defineNuxtConfig({
  modules: ["@sentry/nuxt/module"],
  sentry: {
    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: [
        ".*/**/public/**/*.map",
        ".output/**/public/**/*.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 Vite Plugin's `sourcemaps.filesToDeleteAfterUpload`](https://www.npmjs.com/package/@sentry/vite-plugin#sourcemapsfilestodeleteafterupload) option to delete source maps after they've been uploaded to Sentry.

### [Troubleshooting](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps.md#troubleshooting)

If you're experiencing issues with source maps, see [Troubleshooting Source Maps](https://docs.sentry.io/platforms/javascript/guides/nuxt/troubleshooting.md).

## [Additional Resources](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps.md#additional-resources)

* [Using sentry-cli to Upload Source Maps](https://docs.sentry.io/cli/releases.md#sentry-cli-sourcemaps)
* [4 Reasons Why Your Source Maps Are Broken](https://blog.sentry.io/2018/10/18/4-reasons-why-your-source-maps-are-broken)

## Pages in this section

- [Troubleshooting Source Maps](https://docs.sentry.io/platforms/javascript/guides/nuxt/sourcemaps/troubleshooting_js.md)