Minimum project setup for Javascript SDK


#1

I’m trying out the sentry/browser SDK with a fairly minimal project, and I’m hitting this error when calling Sentry.init:

Uncaught ReferenceError: exports is not defined
    at index.js:3

Where the offending line is

Object.defineProperty(exports, '__esModule', {
  value: true
});

from the file @sentry/browser/dist/index.js. Now my question is that what is the minimal project setup to get the SDK working? What does it expect to have?


#2

Are you referencing @sentry/browser/dist/index.js in your html page?
If so, that is the problem, you should load @sentry/browser/build/bundle.js or
our CDN https://browser.sentry-cdn.com/4.4.1/bundle.min.js

The @sentry/browser/dist/index.js is meant to be used with a bundler.


#3

That’s what I suspected. I’m not explicitly loading any file, just following the instructions in https://docs.sentry.io/error-reporting/quickstart/?platform=browsernpm. So my import was

import * as Sentry from '@sentry/browser';

I included the bundle.js from the main HTML file and that seems to work for now. Thanks! In the future, what’s the mechanism for importing since the bundle.js doesn’t seem to be a JS module?


#4

@HazAT so any chance you would provide a native browser version, instead of requiring the use of a bundler? Target ES instead of commonjs.


#5

We already ship an esm build, we did not document it since we didn’t had time to fully test everything yet (but it seems like it works just fine). It’s in the npm package under /esm/index.js

Hope this helps.


#6

Oh, that’s great! It fails in our project with

Uncaught TypeError: Failed to resolve module specifier "@sentry/utils/esm/logger". Relative references must start with either "/", "./", or "../".

but that could be on us as well. I’ll investigate.