When using @sentry/nuxt: 9.3.0, you have to create sentry.client.config.ts in the root level of your app.

Example sentry.client.config.ts contents:

Sentry.init({
  dsn: 'sentry key'
})

problem is if i use:

export default defineNuxtConfig({
  runtimeConfig: {
    dsnKey: 'secret-key', // available only on a server-side
    public: {}, // exposed to a client-side
  }
)}

public variables will be exposed to a client side in a console window.__NUXT__

but dsnKey is usable only on the server side and sentry.client.config.ts is only a client-side, i don't want to use sentry.server.config.ts, because it will log all server-side errors. What choices do i have?

When using @sentry/nuxt: 9.3.0, you have to create sentry.client.config.ts in the root level of your app.

Example sentry.client.config.ts contents:

Sentry.init({
  dsn: 'sentry key'
})

problem is if i use:

export default defineNuxtConfig({
  runtimeConfig: {
    dsnKey: 'secret-key', // available only on a server-side
    public: {}, // exposed to a client-side
  }
)}

public variables will be exposed to a client side in a console window.__NUXT__

but dsnKey is usable only on the server side and sentry.client.config.ts is only a client-side, i don't want to use sentry.server.config.ts, because it will log all server-side errors. What choices do i have?

• nuxt3.js
• sentry

• seems like stackoverflow is completely dead, since rise of AI :( – Alexander Kim Commented 21 hours ago

1 Answer 1

If you want to use a variable on the client-side during runtime, you need to make it public. The client-side needs to see the DSN to know where to send the errors to.

Your frontend is always public. As soon as you open the browser inspection tools, you are able to see the (minified) code, the network requests etc.

Just make sure to keep your Sentry Auth Token secret - this one is only used during build time.