CODEWITHSUNDEEP
create-react-appsentrysource-maps
Jim Vercoelen
Jim Vercoelen

Reputation: 1077

React omit source maps while keep Sentry recognise them

Context
We're trying to omit any source maps in our production build using react create app while keep uploading it to sentry.

To my understand it's supposed to work, however Sentry refuses to recognise the uploaded source maps.

How we're using it:

Source build commands
Simply (1) creating a build using react scripts including source maps. (2) uploading them to Sentry, and (3) removing all source maps from the generated build.

...
"release": "(export REACT_APP_SENTRY_RELEASE=woodhouse@$(git rev-parse --short HEAD); react-scripts build && node scripts/sentry.js)",
"postrelease": "find ./build -name '*.map' -delete",
...

Scripts/sentry.js
Script uploading it to Sentry using Git commit hash as release.

const SentryCli = require('@sentry/cli');

async function createReleaseAndUpload() {
  ...
  const release = process.env.REACT_APP_SENTRY_RELEASE;
  const cli = new SentryCli();

  try {
    ...
    await cli.releases.new(release);
    await cli.releases.uploadSourceMaps(release, {
      include: ['build/static/js'],
      urlPrefix: '~/static/js',
      rewrite: false,
    });
    await cli.releases.finalize(release);
  }
  ...
}

createReleaseAndUpload();

Init Sentry
Initialising Sentry SDK; using the same git commit hash.

...
const SENTRY_RELEASE = process.env.REACT_APP_SENTRY_RELEASE;
...
    if (SENTRY_RELEASE) {
        /**
         * The release identifier used when uploading respective source maps. Specify
         * this value to allow Sentry to resolve the correct source maps when
         * processing events.
         */
        sentryOptions.release = `${SENTRY_RELEASE}`;
    }

    Sentry.init(sentryOptions);
...

Sentry source map release
As can be seen, Sentry does have the uploaded source maps enter image description here

Sentry Issue
And as can be seen in this issue, which is linked to the same release; it's not recognising the source maps.. enter image description here

Question
What are we doing wrong here? Our aim is to keep using the react scripts but if needed we can eject the project and try using sentry's webpack plugin using devTool: hidden-source-map (see https://webpack.js.org/configuration/devtool/) and deleteAfterCompile option. But at this moment I am not even confident this will even work.

Upvotes: 1

Views: 813

Answers (1)

Luca Forstner
Luca Forstner

Reputation: 241

I recommend deleting everything you have set up in regards to Sentry sourcemaps and running the Sentry source map wizard: https://docs.sentry.io/platforms/javascript/sourcemaps/#uploading-source-maps

Upvotes: 0

Related Questions