getsentry / sentry-javascript-bundler-plugins

JavaScript Bundler Plugins for Sentry
https://sentry.io
BSD 3-Clause "New" or "Revised" License
141 stars 36 forks source link

Sentry Webpack Plugin `Warning: Didn't find any matching sources for debug ID upload.` #569

Closed digicoffey closed 3 months ago

digicoffey commented 4 months ago

Environment

@sentry/react@7.65.0 @sentry/webpack-plugin@2.20.1

Steps to Reproduce

sentryWebpackPlugin({
  org: 'org',
  project: 'project',
  authToken: 'authToken',
  sourcemaps: {
    assets: './dist/**/*.js.map',
    rewriteSources: (source) => source,
  },
  release: {
    name: git.long(),
    inject: true,
    setCommits: {
      auto: true,
    },
    deploy: {
      env: 'env',
    },
  },
  reactComponentAnnotation: {
    enabled: true,
  },
}),

Expected Result

Sourcemaps are injected with a debug_id Sourcemaps are uploaded

Actual Result

Sourcemaps are not injected with a debug_id Sourcemaps are not uploaded

sentry-webpack-debug-id-upload-plugin[sentry-webpack-plugin] Warning: Didn't find any matching sources for debug ID upload. Please check the 'sourcemaps.assets' option.

Context

We have been using the sentry-cli to inject debug_id's and upload our sourcemaps:

sentry-cli sourcemaps inject ./dist
sentry-cli sourcemaps upload --release=release_hash ./dist --org=org --auth-token=token -p=project

We wanted to remove this step from our CI and integrate this as part of our build step using the @sentry/webpack-plugin plugin, but we haven't been able to get it working.

Our assumption, which could be incorrect, is that the inject: true property would handle the injection of the debug_id's, but the plugin can't seem to find them. We have tried changing our sourcemaps.assets to be more and less specific, but nothing seems to work.

If we provide the legacy property, ie:

uploadLegacySourcemaps: {
  paths: ['./public/dist'],
},

The upload of the sourcemaps works, but no debug_id's are injected. Any guidance/advice would be appreciated.

We realise that debug_id's are not mentioned in the documentation, but we thought that maybe the inject: true property would handle this?

lforst commented 4 months ago

Please try removing this option assets: './dist/**/*.js.map' entirely. Thanks!

(assets needs to be both .js files and .js.map files. Only doing .js.map will not work.)

digicoffey commented 4 months ago

Thanks for the response and the guidance, much appreciated.

I have removed the assets property completely, but I still get the same message and result.

[sentry-webpack-plugin] Debug: No `sourcemaps.assets` option provided, falling back to uploading detected build artifacts.
[sentry-webpack-plugin] Warning: Didn't find any matching sources for debug ID upload. Please check the `sourcemaps.assets` option.

Not sure if it something else in our webpack.config that could be preventing this to work? Is there anything you think we should check?

lforst commented 4 months ago

Hmm, that usually indicates that you are using something to side-step the normal asset emission by webpack. Which webpack version are you using?

Can you try setting the assets option to ['./dist/**/*']?

digicoffey commented 4 months ago

I tried your suggestion and am now getting a different issue, but at least it seems to be finding our sourcemaps.

Our webpack version is webpack@5.89.0.

The message we are getting now is:

[sentry-webpack-plugin] Debug: Could not determine debug ID from bundle. This can happen if you did not clean your output folder before installing the Sentry plugin. File will not be source mapped: /path/dist/app.min.js
lforst commented 4 months ago

Ok, that message means that one of the files the plugin found wasn't injected with debug IDs. Are you sure the file isn't a leftover from when you had a build before? Is that file part of your build output?

It's pretty hard to debug this just from debug messages. Would you mind sharing a minimal reproduction example? Depending on your webpack setup there may be third parties that mess with what our plugin does. (Our plugin doesn't do anything too funky so something else is likely doing something shady)

digicoffey commented 4 months ago

Apologies for the delay in getting back to you. Had a priority change today. I will try and get a minimal reproduction to you, but it won't be until next week as I have a few things I need to take care of.

There is quite a lot going on in our webpack, so I'm guessing there must be an issue in there somewhere.

Thanks for your advice and patience.

shareef-dweikat commented 3 months ago

Hi, Have you found a solution? I am having same issue [sentry-webpack-plugin] Warning: Didn't find any matching sources for debug ID upload. Please check thesourcemaps.assetsoption.

lforst commented 3 months ago

@shareef-dweikat what do your plugin options look like? Can you provide reproduction? Thanks!

digicoffey commented 3 months ago

Apologies, my priorities have been changed for the foreseeable future, so we will be sticking with the sentry-cli for now, but I will eventually be coming back to this.

@Iforst actually solved my initial issue, my assets option was incorrect, so not sure if I should keep this issue open?

The next issue, which I have not resolved yet relates to:

[sentry-webpack-plugin] Debug: Could not determine debug ID from bundle. This can happen if you did not clean your output folder before installing the Sentry plugin. File will not be source mapped: /path/dist/app.min.js
shareef-dweikat commented 3 months ago

@lforst Here is my webpack.config.js. I have tried digicoffey solution, it did not work

`const { sentryWebpackPlugin } = require('@sentry/webpack-plugin');

module.exports = { // ... other options devtool: 'source-map', // Source map generation must be turned on plugins: [ // Put the Sentry Webpack plugin after all other plugins sentryWebpackPlugin({ authToken: process.env.SENTRY_AUTH_TOKEN, org: 'ORGNAME', project: 'boka-customer-fe', include: 'public', sourcemaps: { assets: './dist/*/.js.map', ignore: ['./node_modules'], }, }), ], }; `

sentry.config.ts

`import * as Sentry from '@sentry/gatsby';

Sentry.init({ dsn: 'https://97631278f3697adb20bb7f405be2f541@o478484.ingest.us.sentry.io/4507701989408768', integrations: [ Sentry.browserTracingIntegration(), Sentry.replayIntegration(), ],

// Set tracesSampleRate to 1.0 to capture 100% // of transactions for tracing. // We recommend adjusting this value in production tracesSampleRate: 1.0,

// Capture Replay for 10% of all sessions, // plus for 100% of sessions with an error replaysSessionSampleRate: 0.1, replaysOnErrorSampleRate: 1.0, });`

package.json scripts "build": "gatsby build --prefix-paths && yarn sentry:sourcemaps", "sentry:sourcemaps": "sentry-cli sourcemaps inject --org ORGNAME --project boka-customer-fe public && sentry-cli sourcemaps upload --org ORGNAME --project boka-customer-fe public"

lforst commented 3 months ago

@shareef-dweikat your assets option is wrong. You also need to point it to .js files. Ideally you just set it to ./dist/**/*, and the plugin will automatically only just use js and map files.

Also, I don't recommend combining the plugin with sentry-cli.

lforst commented 3 months ago

@digicoffey as for your issue, if possible please open a new issue with reproduction steps. Thanks!

digicoffey commented 3 months ago

Closing as initial issue was resolved. Thanks!

shareef-dweikat commented 3 months ago

@lforst I have tried ./dist/*/ before, it did not work. I just gave it another try, i get same error.

You don't recommend to use the plugin and the cli, what else would you suggest me to use? I am planning to setup Sentry and the plugin manually without the cli. But i am not sure how i am going to inject the debugids, how to generate the sourcemaps, how to upload to sentry....etc You know, the plugin used to handle all these stuff. Can you help me with a good resource? or maybe an alternative approach?

shareef-dweikat commented 3 months ago

@lforst I figured it out. Just installed @sentry/webpack-plugin, it handled everything. Thanks anyway.

lforst commented 3 months ago

@shareef-dweikat I am so confused. In this message you already mentioned using @sentry/webpack-plugin: https://github.com/getsentry/sentry-javascript-bundler-plugins/issues/569#issuecomment-2269121149. Also, I said I don't recommend using the webpack plugin in combination with the CLI. I didn't say I don't recommend either.

shareef-dweikat commented 3 months ago

@lforst Yeah correct, sorry i misspoke in this message. I used @sentry/webpack-plugin with CLI at the past which caused me a lot of issues. Now i am using only @sentry/webpack-plugin, that solved my problem.

So you were right, combining both is not really a good choice.

lforst commented 3 months ago

@shareef-dweikat ok that makes sense 😄 thanks for clarifying! (I was doubting myself)