#js errors

4 messages · Page 1 of 1 (latest)

lilac cedar
#

i want to get error traceback with source code for js just like sentry does for js.
I found out that I need to upload sourcemaps: https://github.com/getsentry/sentry-javascript/discussions/10631
But, I am not sure how am I supposed to attach source files when i have inline js in script tags?

GitHub

I am using Sentry for collecting JavaScript errors. Also, I do not use build tools like Webpack or Vite to transpile JavaScript. Therefore, I am not outputting source maps. In this case, is there a...

native ingotBOT
#

Hi @lilac cedar. I'm happy to dig into this for you! I'll check my internal sources for answers to your question! :wave:

#

For JavaScript errors with inline code in script tags, you have two options to get source code in your error stack traces with Sentry:

  1. Use the ContextLines integration, which is specifically designed for inline JavaScript:

The ContextLines integration adds source code from inline JavaScript in your HTML (like code in <script> tags) to stack traces. This is particularly useful for pages with login protection or other scenarios where Sentry's backend can't access the source code directly.

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

Sentry.init({
  dsn: "<https://examplePublicKey@o0.ingest.sentry.io/0",>
  integrations: [Sentry.contextLinesIntegration()],
});

You can configure how many lines of context to include with the frameContextLines option (defaults to 7 lines around each stack frame) Source Maps - ContextLines Integration.

  1. For non-inline JavaScript files, you would need to upload source maps using the Sentry CLI or bundler plugins. The easiest approach is using the Sentry Wizard:
npx @sentry/wizard@latest -i sourcemaps

This wizard will guide you through:

  • Logging into Sentry and selecting a project
  • Installing necessary packages
  • Configuring your build tool
  • Setting up CI for source map uploads

Source Maps - JavaScript

If you're not using a build tool, you can still upload your source files directly using the Sentry CLI as mentioned in the GitHub discussion you referenced, but you'll need to add the sourceMappingURL comment to your files for Sentry to properly associate them.

#

Hope this helps with your inline JavaScript error tracking!

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: