JavaScript SourceMap is not used

1

We have followed the instructions in the documentation so we can upload source maps to Sentry without them being available on the web as outlined here: uploading source maps to sentry

As far as I can tell we have configured this correctly yet Sentry is not using the source map.

We have created a release:

Screen Shot 2017-02-27 at 1.34.02 PM.png995×173 15.8 KB

The release has a souce map artifact:

…I can only upload 1 image as a new user… view full post here please

I can see the source map name in the public main.js file on our server.

//# sourceMappingURL=main.js.map

We are initializing Raven with the release id:

…I can only upload 1 image as a new user… see link above please.

NOTE

main.js.map is NOT hosted on our static server, and the location of main.js is hashed, and would live at something like static/da94f5ffc8cff78aca266ed057cc823a53d460a3/js/main.js. It may be possible that Sentry sees the sourceMappingUrl directive and ignores the uploaded artifacts, but I would like someone to confirm this before I go about changing our build process.

Thanks!

2

The tilde (~) prefix only removes protocol, host, and port. It does not clear the full path leading up to your file.

So if main.js is located here:

https://example.com/static/da94f5ffc8cff78aca266ed057cc823a53d460a3/js/main.js

You need to name your source map as:

~/static/da94f5ffc8cff78aca266ed057cc823a53d460a3/js/main.js.map
3

Just to confirm, will this work even if main.js.map is not actually at that location? As noted the map file is not publicly available on the web, and we will not be putting it out there.

4

Just to confirm, will this work even if main.js.map is not actually at that location?

Yes.

5

Okay, I will give that a try. Thanks for the quick reply.

6

This doesn’t seem to solve the issue, maybe I have misunderstood. When you say:

You need to name your source map

Does this mean in the sourceMappingURL directive in main.js? In my latest deploy the file is located at:

static/a2b4b132ff909def364b194eebcb4b8ed7e656f8/main.js

and the last line of the file is:

//# sourceMappingURL=~/static/a2b4b132ff909def364b194eebcb4b8ed7e656f8/main.js.map
7

Ok so I resolved the issue with some help from Sentry support. There was a bit of a terminology confusion, when referring to “naming your sourcemap”. This is referring to the name of the sourcemap as a Sentry artifact, not how it is named in in the sourceMappingURL directive. So the solution should look like this:

File hosted at:
https://example.com/static/da94f5ffc8cff78aca266ed057cc823a53d460a3/js/main.js

Directive in file:
//# sourceMappingURL=main.js.map

Artifact name in sentry:
~/static/da94f5ffc8cff78aca266ed057cc823a53d460a3/js/main.js.map

The artifact name was what took some time to understand. We use the sentry-cli tool, which also needs a bit of explaination. You can use upload-sourcemaps like this to get it named right in the release artifacts:

sentry-cli [.....] upload-sourcemaps --url-prefix "~/static/da94f5ffc8cff78aca266ed057cc823a53d460a3/js/" /dist/main.js.map

Hope someone finds this useful.

-Jon

8

We should probably make the docs clearer on this. I was also wondering if it makes sense to have sentry-cli have an auto discover mode where you point it to the URL of a minified file and it explains you the command to run to upload the sourcemaps correctly.

9

Sorry, that I didn’t created a new thread but I’m also have the same problem. And can’t figure out the problem.

  1. My js is served from https://example.com/static/common-123.js
  2. sourceMappingURL is common-123.js
  3. I uploaded sourcemaps and js to sentry using webpack as ~/static/common-123.js and ~/static/common-123.js.map
  4. Release IDs have fine setup and js errors have correct link to release with correct artefact.
  5. But source maps are not working! In Sentry JSON I see: "sourcemap": "https://example.com/static/client-8ac88d938fa41f089764.js.map"

What is the problem?

10

Do you get an error on the events? If yes, which one?

11

No errors. But in event JSON “data” -> “sourcemap” is "https://example.com/static/client-8ac88d938fa41f089764.js.map"

12

hi~ i have some questions

if i’m hosting js file in https://example.com/web/19a37b68/js/about.3a7t51c.child.js

//# sourceMappingURL=../sourcemap/about.3a7t51c.map

do i need to upload js & sourcemap file to sentry.io? or upload sourcemap file is enough？

should i name sourcemap like this?

~/web/19a37b68/js/about.3a7t51c.map

or

~/web/19a37b68/sourcemap/about.3a7t51c.map

==================

:smile: try it and solved, should add urlPrefix: ‘~/web/19a37b68/sourcemap’

1 Like
13

I did this write up https://github.com/getsentry/sentry-webpack-plugin/issues/228#issuecomment-780733335 in case it helps anyone in the future.