Sentry integration with Pinia

[gabrielgomeso]

I'm trying to use the Sentry with pinia integration and got a type error

The code:

Sentry.init({
  // If set up, you can use your runtime config here
  // dsn: useRuntimeConfig().public.sentry.dsn,
  dsn: "https://xyz",

  // We recommend adjusting this value in production, or using tracesSampler
  // for finer control
  tracesSampleRate: 1.0,
  integrations: [Sentry.piniaIntegration(usePinia())],
});

The error:

Property 'piniaIntegration' does not exist on type 'typeof import("/home/gabriel/project/node_modules/@sentry/nuxt/build/types/index.types")'. Did you mean 'prismaIntegration'?ts(2551)

Is that correct?
Also, I'm getting kind of confused on how to set up the project properly. I set the env variable in the project, but I don't pass it in any place because I've read somewhere in the docs that the module would read it by itself, but in production and staging the data is not being tracked. My setup is

sentry: {
    sourceMapsUploadOptions: {
      org: "org-name",
      project: "project-name",
      authToken: process.env.SENTRY_AUTH_TOKEN,      
    },
  },

Then I have a sentry.client.config.ts and a sentry.server.config.ts like in the docs. Is that all I need?

[lforst]

As for the pinia error: Are you on the latest version of the SDK?

As for prod/staging data: Are you missing data in general or just source maps?

@s1gr1d cc

[gabrielgomeso]

When I run yarn dev I get this:

yarn dev
yarn run v1.22.22
$ nuxt dev
Nuxt 3.13.2 with Nitro 2.9.7                                                                                                                                                                             09:41:01
                                                                                                                                                                                                         09:41:01
  ➜ Local:    http://localhost:3000/
  ➜ Network:  use --host to expose

ℹ Using default Tailwind CSS file                                                                                                                                                      nuxt:tailwindcss 09:41:02
  ➜ DevTools: press Shift + Alt + D in the browser (v1.4.2)                                                                                                                                              09:41:03

[Sentry] Your application is running in development mode. Note: @sentry/nuxt is in beta and may not work as expected on the server-side (Nitro). Errors are reported, but tracing does not work.         09:41:03
ℹ Tailwind Viewer: http://localhost:3000/_tailwind/                                                                                                                                    nuxt:tailwindcss 09:41:03
✔ Vite client built in 86ms                                                                                                                                                                             09:41:04
✔ Vite server built in 780ms                                                                                                                                                                            09:41:05
✔ Nuxt Nitro server built in 554 ms                                                                                                                                                               nitro 09:41:05
ℹ Vite client warmed up in 1ms                                                                                                                                                                          09:41:05
Sentry Logger [log]: Initializing Sentry: process: 231345, thread: worker-1.
Sentry Logger [log]: Integration installed: InboundFilters
Sentry Logger [log]: Integration installed: FunctionToString
Sentry Logger [log]: Integration installed: LinkedErrors
Sentry Logger [log]: Integration installed: RequestData
Sentry Logger [log]: Integration installed: Console
Sentry Logger [log]: Integration installed: NodeFetch
Sentry Logger [log]: Integration installed: OnUncaughtException
Sentry Logger [log]: Integration installed: OnUnhandledRejection
Sentry Logger [log]: Integration installed: ContextLines
Sentry Logger [log]: Integration installed: LocalVariablesAsync
Sentry Logger [log]: Integration installed: Context
Sentry Logger [log]: Integration installed: ProcessAndThreadBreadcrumbs
Sentry Logger [log]: Integration installed: Http
Sentry Logger [log]: Running in ESM mode.
Sentry Logger [debug]: @opentelemetry/api: Registered a global for diag v1.9.0.
Sentry Logger [debug]: @opentelemetry/api: Registered a global for trace v1.9.0.
Sentry Logger [debug]: @opentelemetry/api: Registered a global for context v1.9.0.
Sentry Logger [debug]: @opentelemetry/api: Registered a global for propagation v1.9.0.

When I run yarn build I get from Sentry (I removed some of the build logs):

[Sentry] Enabled source map generation in the build options with nitro.rollupConfig.output.sourcemap: hidden.                                                                                            09:42:24
[Sentry] Disabled source map setting in the Nuxt config: nitro.rollupConfig.output.sourcemapExcludeSources. Source maps will include the actual code to be able to un-minify code snippets in Sentry.    09:42:24
[Sentry] Setting sentry.sourceMapsUploadOptions.sourcemaps.filesToDeleteAfterUpload: [".*/**/*.map"] to delete generated source maps after they were uploaded to Sentry.                                 09:42:24
[09:42:24] [sentry-rollup-plugin] Warning: No auth token provided. Will not create release. Please set the authToken option. You can find information on how to generate a Sentry auth token here: https://docs.sentry.io/api/auth/
[09:42:24] [sentry-rollup-plugin] Warning: No auth token provided. Will not upload source maps. Please set the authToken option. You can find information on how to generate a Sentry auth token here: https://docs.sentry.io/api/auth/
[09:42:24] [sentry-vite-plugin] Warning: No auth token provided. Will not create release. Please set the authToken option. You can find information on how to generate a Sentry auth token here: https://docs.sentry.io/api/auth/
[09:42:24] [sentry-vite-plugin] Warning: No auth token provided. Will not upload source maps. Please set the authToken option. You can find information on how to generate a Sentry auth token here: https://docs.sentry.io/api/auth/
[sentry-vite-plugin] Info: Sending telemetry data on issues and performance to Sentry. To disable telemetry, set `options.telemetry` to `false`.
[09:42:27] [sentry-vite-plugin] Warning: No auth token provided. Will not create release. Please set the authToken option. You can find information on how to generate a Sentry auth token here: https://docs.sentry.io/api/auth/
[09:42:27] [sentry-vite-plugin] Warning: No auth token provided. Will not upload source maps. Please set the authToken option. You can find information on how to generate a Sentry auth token here: https://docs.sentry.io/api/auth/
                                                                                                                                                                           [sentry-vite-plugin] Info: Sending telemetry data on issues and performance to Sentry. To disable telemetry, set `options.telemetry` to `false`.                                                                                                                                                                                    09:42:28
✔ Server built in 952ms                                                                                                                                                                                 09:42:28
✔ Generated public .output/public                                                                                                                                                                 nitro 09:42:28
ℹ Building Nuxt Nitro server (preset: node-server)                                                                                                                                                nitro 09:42:28
[sentry-rollup-plugin] Info: Sending telemetry data on issues and performance to Sentry. To disable telemetry, set `options.telemetry` to `false`.
✔ Nuxt Nitro server built  

I've added that vercel/nft package to handle the 'import-in-the-middle' error. So when I run yarn start I get this:

yarn start
yarn run v1.22.22
$ node --env-file=.env .output/server/index.mjs
Sentry Logger [log]: Initializing Sentry: process: 233980, thread: main.
Sentry Logger [log]: Integration installed: InboundFilters
Sentry Logger [log]: Integration installed: FunctionToString
Sentry Logger [log]: Integration installed: LinkedErrors
Sentry Logger [log]: Integration installed: RequestData
Sentry Logger [log]: Integration installed: Console
Sentry Logger [log]: Integration installed: NodeFetch
Sentry Logger [log]: Integration installed: OnUncaughtException
Sentry Logger [log]: Integration installed: OnUnhandledRejection
Sentry Logger [log]: Integration installed: ContextLines
Sentry Logger [log]: Integration installed: LocalVariablesAsync
Sentry Logger [log]: Integration installed: Context
Sentry Logger [log]: Integration installed: ProcessAndThreadBreadcrumbs
Sentry Logger [log]: Integration installed: Http
Sentry Logger [log]: Running in ESM mode.
Sentry Logger [debug]: @opentelemetry/api: Registered a global for diag v1.9.0.
Sentry Logger [debug]: @opentelemetry/api: Registered a global for trace v1.9.0.
Sentry Logger [debug]: @opentelemetry/api: Registered a global for context v1.9.0.
Sentry Logger [debug]: @opentelemetry/api: Registered a global for propagation v1.9.0.
Sentry Logger [debug]: @opentelemetry_sentry-patched/instrumentation-http Applying instrumentation patch for nodejs core module on require hook { module: 'http' }
Sentry Logger [debug]: @sentry/instrumentation-http Applying instrumentation patch for nodejs core module on require hook { module: 'http' }
Sentry Logger [debug]: @opentelemetry_sentry-patched/instrumentation-http Applying instrumentation patch for nodejs core module on require hook { module: 'https' }
Sentry Logger [debug]: @sentry/instrumentation-http Applying instrumentation patch for nodejs core module on require hook { module: 'https' }
Listening on http://[::]:3000
Sentry Logger [debug]: @sentry/instrumentation-http http instrumentation for incoming request
Sentry Logger [debug]: @opentelemetry_sentry-patched/instrumentation-http http instrumentation incomingRequest
Sentry Logger [debug]: Recording is off, propagating context in a non-recording span
Sentry Logger [log]: Flushing events...
Sentry Logger [log]: SpanExporter exported 0 spans, 0 unsent spans remaining
Sentry Logger [log]: Flushing outcomes...
Sentry Logger [log]: No outcomes to send
Sentry Logger [log]: Done flushing events
Sentry Logger [debug]: @sentry/instrumentation-http http instrumentation for incoming request
Sentry Logger [debug]: @opentelemetry_sentry-patched/instrumentation-http http instrumentation incomingRequest
Sentry Logger [debug]: Recording is off, propagating context in a non-recording span
Sentry Logger [log]: Flushing events...
Sentry Logger [log]: SpanExporter exported 0 spans, 0 unsent spans remaining
Sentry Logger [log]: Flushing outcomes...
Sentry Logger [log]: No outcomes to send
Sentry Logger [log]: Done flushing events

[lforst]

Hm, that looks weird. Would you mind creating a minimal reproduction example we can run to see what is going on? Thanks!

[gabrielgomeso]

Basically this: https://github.com/gabrielgomeso/duplicata
I just removed the stores and general functionalities for now but the way I configure Sentry and packages are there (then in nuxt.config I configure the project org and name with the sentry auth token, and in sentry.server.config the dsn with the sentry env)

[lforst]

When I try out your repro, I definitely get data from the client (browser).

On the server no transactions are created. @s1gr1d @andreiborza Do you happen to know why that is the case?

[andreiborza]

@gabrielgomeso @lforst the tracesSampleRate is not set, so no server transactions.

Set tracesSampleRate: 1.0 in sentry.server.config.ts to enable that.

Also dev mode is currently not supported.

[09:42:24] [sentry-rollup-plugin] Warning: No auth token provided. Will not create release. Please set the authToken option. You can find information on how to generate a Sentry auth token here: https://docs.sentry.io/api/auth/

Please double check your auth token is setup correctly (see https://docs.sentry.io/account/auth-tokens/).