z0lo13
commented
3 weeks ago I have found the woraround.
Instead of initializing the plugin inside the nuxt.config.ts, i created a client plugin with the following:
import * as Sentry from '@sentry/vue'
export default defineNuxtPlugin((nuxtApp) => {
const router = useRouter()
const { public: { sentry } } = useRuntimeConfig()
if (!sentry.dsn) {
return
}
Sentry.init({
app: nuxtApp.vueApp,
dsn: sentry.dsn,
environment: sentry.environment,
integrations: [
Sentry.browserTracingIntegration({ router }),
Sentry.replayIntegration({
maskAllInputs: false,
maskAllText: false,
})
],
tracesSampleRate: 0.2, // Change in prod
replaysSessionSampleRate: 0, // Change in prod
replaysOnErrorSampleRate: 1.0, // Change in prod if necessary
})
})server plugin:
import * as Sentry from '@sentry/node'
import {
nodeProfilingIntegration,
} from '@sentry/profiling-node'
import { H3Error } from 'h3'
export default defineNitroPlugin((nitroApp) => {
const { public: { sentry } } = useRuntimeConfig()
if (!sentry.dsn) {
console.warn('Sentry DSN not set, skipping Sentry initialization')
return
}
Sentry.init({
dsn: sentry.dsn,
environment: sentry.environment,
integrations: [
nodeProfilingIntegration(),
],
// Performance Monitoring
tracesSampleRate: 0.2,
// Set sampling rate for profiling - this is relative to tracesSampleRate
profilesSampleRate: 0.2,
})
nitroApp.hooks.hook('error', (error) => {
// Do not handle 404s and 422s
if (error instanceof H3Error) {
if (error.statusCode === 404 || error.statusCode === 422) {
return
}
}
// checkf if error is not about missing .map file
if (error.message && error.message.includes('.map')) {
return
}
Sentry.captureException(error)
})
nitroApp.hooks.hook('request', (event) => {
event.context.$sentry = Sentry
})
nitroApp.hooks.hookOnce('close', async () => {
await Sentry.close(2000)
})
})Inside my nuxt.config.ts
do not add anything under modules, but:
vite: {
plugins: [
// Put the Sentry vite plugin after all other plugins
sentryVitePlugin({
disable: process.env.NODE_ENV === 'development',
authToken: "",
org: "market-wiz",
project: "hmc-crm-nuxt",
telemetry: false,
}),
],
}However, the @sentry/vue does throw a 500 full page error, which is not the wanted behaviour, and the @sentry/nuxt have it fixed. Therefore as for now it is impossible to fully use sentry with nuxt
s1gr1d
Is there an existing issue for this?
How do you use Sentry?
Sentry Saas (sentry.io)
Which SDK are you using?
@sentry/nuxt
SDK Version
8.32.0
Framework Version
Nuxt 3.13.2
Link to Sentry event
https://market-wiz.sentry.io/issues/5937402524/?project=4507160564858880&query=is%3Aunresolved%20issue.priority%3A%5Bhigh%2C%20medium%5D&referrer=issue-stream&statsPeriod=24h&stream_index=1
Reproduction Example/SDK Setup
in nuxt.config.ts
sentry.client.config.ts
Also during the build the following warnings outputed:
Steps to Reproduce
Expected Result
Have sourcemaps linked
Actual Result
Seems to me that only server-side sourcemaps are uploaded.