Sourcemaps and events with debug ids are not matching

[francois-launchbase]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/nuxt

SDK Version

8.34.0

Framework Version

Nuxt 3.13.2

Link to Sentry event

https://launchbase.sentry.io/share/issue/8a9d1595927f499e8a2283814fc989f6/

Reproduction Example/SDK Setup

N/A

Steps to Reproduce

We've configured @sentry/nuxt in a new project. A release is being created and the corresponding sourcemaps are uploaded (by making use of sourceMapsUploadOptions):

Expected Result

After triggering an error we expect to see the unminified code in the error details (we did check the list on the current Nuxt SDK roadmap and could not find any sign indicating that this is feature that's still in the pipeline).

Actual Result

Instead of seeing the unminified code we get the "Unminify Code" button.

According to the dialogue our Debug IDs seem to be setup correctly

For this particular event we can confirm that the event JSON does indeed contain a debug id:

"debug_meta": {
    "images": [
      {
        "code_file": "https://--------/_nuxt/CLhFwiEt.js",
        "debug_id": "1a7b60ac-d7af-4f1e-97ad-c7a231f9d1c5",
        "type": "sourcemap"
      }
    ]
  },

and that both the Debug ID and Source Map Reference is present in the artifacts

Now it seems like the only thing left do do is to get these two entities to match with each other but we've run out of ideas and instructions to follow 🤕

[lforst]

I looked at your event payload and Sentry was actually able to sourcemap the stack frame but it seems like your sourcemaps are just buggy. In your place I would verify that every tool and plugin in your build toolchain actually emits proper sourcemaps. Often times plugins have a sourcemap setting.

[francois-launchbase]

Thanks for checking it out @lforst!

It's a relatively barebones project so the only notable warnings that I see in the build output are repeats of these two lines:

[plugin nuxt:components-loader] Sourcemap is likely to be incorrect: a plugin (nuxt:components-loader) was used to transform files, but didn't generate a sourcemap for the transformation. Consult the plugin documentation for help
[plugin nuxt:tree-shake-composables:transform] Sourcemap is likely to be incorrect: a plugin (nuxt:tree-shake-composables:transform) was used to transform files, but didn't generate a sourcemap for the transformation. Consult the plugin documentation for help

I did not think much of these because they are default plugins (as far as I'm aware) so I assume anyone that's working with Sentry Nuxt should have these plugins enabled as well. Are there known sourcemap settings for these two plugins that I've missed along the way?

[lforst]

@s1gr1d have you come across this before?

[darthf1]

I had similar sourcemap warnings during build; explicitly enabling sourcemaps resolved that part for me. I thought that should not be needed when using the nuxt module, but I didn't investigate further.

export default defineNuxtConfig({
  sourcemap: {
    server: true,
    client: true,
  },
  vite: {
    build: {
      sourcemap: true,
    },
  }
})

[francois-launchbase]

@lforst you got us on the right track.

@darthf1 your solution did the trick (I definitely would not have added these seemingly redudent configurations).

The build error message are gone and the events are using the sourcemaps, thanks!

[darthf1]

Before closing, maybe @lforst can comment on whether or not adding this config should be necessary, when using the nuxt module? :)

[lforst]

I'll let @s1gr1d make the call on this since she owns the Nuxt SDK. In my opinion, the SDK should likely add these flags out of the box iff they're not set to anything.

[francois-launchbase]

Good suggestion @darthf1. I've reopened it so that they can close it when they're happy.

[s1gr1d]

I think it makes sense the Nuxt SDK adds those options already so you don't have to set them. I'll put this issue on the roadmap.

Edit: Sadly, I cannot overwrite this setting as Nuxt already sets default values (Nuxt docs) and I cannot determine whether this was set by the user or Nuxt. To enable source maps for the client, the client option has to be set manually:

export default defineNuxtConfig({
  sourcemap: {
    client: true,
  },
})

[github-actions]

A PR closing this issue has just been released 🚀

This issue was referenced by PR #14020, which was included in the 8.35.0 release.