Overview

When viewing errors in Error Tracking, Datadog can display the source code lines surrounding each frame in the stack trace. The Source Code Context build plugin enables this feature by injecting a small runtime snippet into your bundle that associates stack traces with your service and version metadata.

At build time, the plugin injects a snippet that writes metadata to window.DD_SOURCE_CODE_CONTEXT. At runtime, the RUM SDK reads window.DD_SOURCE_CODE_CONTEXT to tag errors with the correct service and version for source code resolution. This works in conjunction with uploaded source maps — source maps provide the file mapping, and window.DD_SOURCE_CODE_CONTEXT provides the service and version association.

Prerequisites

• Source maps uploaded to Datadog, either through the Source Maps build plugin or manually.
• The RUM SDK initialized with matching service and version parameters.
• The Datadog build plugin installed and registered with your bundler. See Build Plugins for installation instructions.

Configuration

Configure the rum.sourceCodeContext object in your build plugin options:

Example

The following example shows source code context combined with source maps, a common pairing:

const { datadogWebpackPlugin } = require('@datadog/webpack-plugin');

module.exports = {
  plugins: [
    datadogWebpackPlugin({
      auth: {
        apiKey: process.env.DATADOG_API_KEY,
      },
      errorTracking: {
        sourcemaps: {
          service: 'my-application',
          releaseVersion: '1.0.0',
          minifiedPathPrefix: 'https://example.com/static/',
        },
      },
      rum: {
        sourceCodeContext: {
          service: 'my-application',
          version: '1.0.0',
        },
      },
    }),
  ],
};

Further reading

Documentation, liens et articles supplémentaires utiles:

Upload JavaScript Source MapsDOCUMENTATION Error TrackingDOCUMENTATION Debug SymbolsDOCUMENTATION Datadog Build Plugins GitHub RepositorySOURCE CODE