Log to console with Sentry

I like to use Sentry for logging my front-end apps in production. But in development, I like to see logs in the browser’s console instead of having to see them in my Sentry account.

If I use console.log, I can’t easily turn it off depending on the log level I’ve set. Theen , I’ll now have two separate logging streams to manage.

After some digging, turns out I can use Sentry to log to the console as well.

Simply adding a beforeSend method as below does thee trick:

Sentry.init({
  dsn: process.env.REACT_APP_SENTRY_DSN,
  integrations: [new BrowserTracing()],
  beforeSend: (event, hint) => {
    if (process.env.NODE_ENV !== "production") {
      // eslint-disable-next-line no-console
      console.error(hint.originalException || hint.syntheticException);
    }
    return event;
  },
  tracesSampleRate: 1.0,
});

Now I can use Sentry for logging everything.