Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 17 additions & 24 deletions platform-includes/getting-started-config/javascript.nuxt.mdx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
To set up the Sentry SDK, register the Sentry Nuxt module and initialize the SDK for client and server. At build time, the Sentry Nuxt Module looks for the following two files:

- Client-Side: `sentry.client.config.(js|ts)` in the root containing `Sentry.init`
- Server-Side: `instrument.server.mjs` in the `public` directory containing `Sentry.init`
- Client-Side: `sentry.client.config.ts` in the root containing `Sentry.init`
- Server-Side: `sentry.server.config.ts` in the root containing `Sentry.init`

In these files, you can specify the full range of <PlatformLink to="/configuration/options">Sentry SDK options</PlatformLink>.

Expand Down Expand Up @@ -44,40 +44,33 @@ Sentry.init({
import * as Sentry from '@sentry/nuxt';

Sentry.init({
dsn: "___PUBLIC_DSN___"
dsn: "___PUBLIC_DSN___",

// We recommend adjusting this value in production, or using tracesSampler
// for finer control
tracesSampleRate: 1.0
});
```

The Nuxt `useRuntimeConfig()` does not work in the Sentry server config due to technical reasons (the config file has to
be loaded before Nuxt is loaded). To be able to use `process.env` you either have to add `--env-file=.env` to your node command
or use the `dotenv` package:

```bash {tabTitle: env-file}
node --env-file=.env --import ./.output/server/sentry.server.config.mjs .output/server/index.mjs
```bash {tabTitle: node}
node --env-file=.env .output/server/index.mjs
```

or use the `dotenv` package:


```javascript {tabTitle: dotenv} {filename:sentry.server.config.ts} {1,4}
```javascript {tabTitle: Server Config} {filename:sentry.server.config.ts} {1,3}
import dotenv from 'dotenv';
import * as Sentry from '@sentry/nuxt';

dotenv.config();

Sentry.init({
dsn: "___PUBLIC_DSN___"
});
// ... rest of the file
```
Comment on lines 55 to 70
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No need to act now - just sharing my thoughts: I don't think how users can pass env vars into their app shouldn't be in our documentation but idk.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I added it because there's no need to do those extra steps when using Nuxt. Usually, you can use useRuntimeConfig(), where your env vars are set and process.env can be used without explicitly installing dotenv.

However, as the server-side config is loaded before any Nuxt code is loaded, the env setup has to be done manually.


2. Add an [--import flag](https://nodejs.org/api/cli.html#--importmodule) to the Node options of your `node` command you run
in production (not `nuxt preview`), so the file loads before any other imports (keep in mind the `.mjs` file ending).
Depending on your setup, you might need to adjust the path to the `sentry.server.config.mjs` file:

```json {filename:package.json} {4}
{
"scripts": {
"preview": "nuxt preview",
"start": "node --import ./.output/server/sentry.server.config.mjs .output/server/index.mjs"
}
}
```

<Alert level="warning">
In the beta state of the Nuxt SDK, some features may not work with certain deployment providers. Check the progress on GitHub: [Compatibility with different Deployment Platforms](https://github.com/getsentry/sentry-javascript/issues/14029)
</Alert>

Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<Alert level="warning">
This SDK is considered **experimental and in an alpha state**. It may experience breaking changes. Please reach out on
This SDK is **in an beta state**. It may still experience changes in behavior. Please reach out on
[GitHub](https://github.com/getsentry/sentry-javascript/issues/new/choose) if you have any feedback or concerns.
</Alert>
11 changes: 11 additions & 0 deletions platform-includes/getting-started-sourcemaps/javascript.nuxt.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -24,3 +24,14 @@ export default defineNuxtConfig({
}
});
```

To upload source maps, the Sentry Nuxt Module will automatically enable source map generation in your project if it is not already enabled.
However, you need to explicitly enable source map generation on the client-side. To do this, add the following code to your Nuxt configuration:

```javascript {filename:nuxt.config.ts} {2}
export default defineNuxtConfig({
sourcemap: { client: true }
});
```

This step is necessary because Nuxt sets default values for source maps ([Nuxt docs](https://nuxt.com/docs/api/nuxt-config#sourcemap)), and the Sentry Nuxt Module keeps these settings when they are explicitly defined.
Loading