Errors trying to import sentryio into web application

I am trying to import sentryio into my appliction using steal 0.16.10. However every method of importing I have tried results in some kind of error. I have successfully imported sentryio but this required I map out all of the files and provide @empty reference for two more files that do not seem to exist in my project.

Currently this is what my working mappings look like:

“map”: {
“mootools/mootools”: “mootools”,
“mootools-more/mootools-more”: “mootools-more”,
“mootools-datepicker/mootools-datepicker”: “mootools-datepicker”,
“mooRainbow/mooRainbow”: “mooRainbow”,
“sinon”: “sinon/pkg/sinon”,
“qrcode”: “node_modules/qrcodejs/”,
“chai”: “chai/chai”,
“steal-mocha”: “steal-mocha/steal-mocha”,
“sentry/sentry”: “node_modules/sentry/browser/dist/index”,
“sentry/core”: “node_modules/sentry/core/dist/index”,
“sentry/minimal”: “node_modules/sentry/minimal/dist/index”,
“sentry/hub”: “node_modules/sentry/hub/dist/index”,
“node_modules/sentry/core/dist/integrations”: “node_modules/sentry/core/dist/integrations/index”,
“sentry/utils/object”: “node_modules/sentry/utils/object”,
“sentry/types”: “node_modules/sentry/types/dist/index”,
“sentry/utils/async”: “node_modules/sentry/utils/async”,
“sentry/utils/logger”: “node_modules/sentry/utils/logger”,
“sentry/utils/misc”: “node_modules/sentry/utils/misc”,
“sentry/utils/string”: “node_modules/sentry/utils/string”,
“sentry/utils/is”: “node_modules/sentry/utils/is”,
“sentry/utils/path”: “node_modules/sentry/utils/path”,
“node_modules/sentry/core/dist/integrations/dedupe”: “node_modules/sentry/core/dist/integrations/dedupe”,
“node_modules/sentry/core/dist/integrations/functiontostring”: “node_modules/sentry/core/dist/integrations/functiontostring”,
“node_modules/sentry/core/dist/integrations/sdkinformation”: “node_modules/sentry/core/dist/integrations/sdkinformation”,
“node_modules/sentry/core/dist/integrations/inboundfilters”: “node_modules/sentry/core/dist/integrations/inboundfilters”,
“node_modules/sentry/core/dist/integrations/pluggable/debug”: “node_modules/sentry/core/dist/integrations/pluggable/debug”,
“node_modules/sentry/core/dist/integrations/pluggable/rewriteframes”: “node_modules/sentry/core/dist/integrations/pluggable/rewriteframes”,
“setTimeout”: “empty”,
“setInterval”: “empty”
},

This really does not seem correct to me, especially since i need to do @empty for setTimeout, and setInterval. These two files also do not seem to exist in my project so I am wondering where they are coming from. It only tries to find these files if I begin importing all of the sentryio files.

Does anyone have suggestions or improvements I could make? I have tried several other methods of importing all of which end up giving me similar errors where it requires @core, or these setTimeout and setInterval files.

1 Like

From the gitter thread: https://gitter.im/stealjs/steal?at=5be334febb88787474922686

you said you were seeing warnings like @sentry/core.js. Why is there an @ here? Are you importing it like @sentry instead of sentry?

Are those mappings whose key (left side) starts with node_modules/ actually necessary? That seems wrong.

Also, you should be able to avoid using node_modules on the value (right side) too. Instead of:

“sentry/sentry”: “node_modules/sentry/browser/dist/index”

I think

“sentry/sentry”: “sentry/browser/dist/index”

Should work.

Did you try installing https://www.npmjs.com/package/@sentry/browser and importing it like:

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

Sentry.init({
  dsn: 'https://<key>@sentry.io/<project>',
  integrations: [new MyAwesomeIntegration()]
});

from: https://docs.sentry.io/platforms/javascript/

with no steal configuration? What happens?

The error message said it couldn’t find @sentry/core, so I used that. I assume its because the node_module folder name is @sentry

I originally tried doing that (you need the @sentry)

npm-extension.js:269 Error loading “@sentry/browser@4.2.4#browser” at https://www01.dev.net/node_modules/@sentry/browser/browser.js
Error loading “@sentry/browser@4.2.4#browser” from “ucp2/ucp2” at https://www01.dev.net/ucp2/ucp2.js
Not Found: https://www01.dev.net/node_modules/@sentry/browser/browser/index.js undefined

I used steal syntax to import, however I tried making an es6 module that imported sentry, then exported it as a module. I then tried to compile that and I got the exact same errors

Hi @ptc, I made a really simple example repo with steal@0.16 and sentry: https://github.com/chasenlehara/steal-sentry

When I load the index page with an http server, I see some normal 404s (with a warning from steal that these are normal :blush:) and the Sentry object logged. No config required.

@chasen Thank you for making that example. I modified it a bit and was able to reproduce the error i’m having. The modifications I’ve made resembles my real code more closely however I think the biggest difference between them is that I am using steal syntax to import instead of es6 imports.

For example:

steal(

@sentry/browser’,

function(sentry) {

//code

});

I provided you with a link to the repo with my modifications for you to look at. This is the link: https://github.com/pmoscuzza-tc/steal-sentry-grunt,

You will need to do an npm install and run grunt.

You will also need to run it on a server. I used http-server.

You should get the setTimeout and setInterval.js error I mentioned.

In this particular example I don’t seem to get the “Error loading “@sentry/core”” I’ll try to figure out how to reproduce that error.