What is @sentry/webpack-plugin?
The @sentry/webpack-plugin is a plugin for Webpack that enables you to automatically upload source maps to Sentry, facilitating better debugging of JavaScript errors by linking errors to the original source code, rather than the minified or compiled code served to clients. It integrates seamlessly with Sentry's error tracking and monitoring system, making it easier to track down and fix issues in production environments.
What are @sentry/webpack-plugin's main functionalities?
Source Maps Upload
Automatically uploads source maps to Sentry for better error tracking and debugging. This feature is crucial for understanding and resolving issues in production by linking errors back to the original source code.
{
plugins: [
new SentryWebpackPlugin({
include: ".", // The directory to include in source maps upload
ignore: ["node_modules", "webpack.config.js"], // Files and directories to ignore
urlPrefix: "~/static/js", // Prefix that will be added to each of the files in the `include` option
release: process.env.RELEASE_VERSION // The release version to associate the source maps with
})
]
}
Release Health Tracking
Configures release and deploy information, enabling tracking of release health within Sentry. This helps in monitoring the impact of each release on your application's stability and performance.
{
plugins: [
new SentryWebpackPlugin({
release: process.env.RELEASE_VERSION, // Define the release version
setCommits: {
repo: 'your-repo-name',
auto: true
},
deploy: {
env: 'production'
}
})
]
}
Other packages similar to @sentry/webpack-plugin
source-map-loader
The source-map-loader uses source maps to allow you to debug your original source code instead of the transformed code. While it doesn't upload source maps to Sentry, it serves a similar purpose in improving the debugging experience by handling source maps in Webpack builds.
webpack-bugsnag-plugins
This package provides a set of Webpack plugins for integrating with Bugsnag, similar to how @sentry/webpack-plugin integrates with Sentry. It includes features for uploading source maps to Bugsnag and automatically reporting build information, offering a comparable functionality for error tracking and monitoring in applications.
Sentry Webpack Plugin
A webpack plugin acting as an interface to Sentry CLI.
Installation
Using npm:
$ npm install @sentry/webpack-plugin
Using yarn:
$ yarn add @sentry/webpack-plugin
CLI Configuration
You can use either .sentryclirc
file or ENV variables described here https://docs.sentry.io/learn/cli/configuration/
Usage
const SentryCliPlugin = require('@sentry/webpack-plugin');
const config = {
plugins: [
new SentryCliPlugin({
release: function(hash) {
return hash.slice(0, 5);
},
include: '.',
ignoreFile: '.sentrycliignore',
ignore: ['node_modules', 'webpack.config.js'],
configFile: 'sentry.properties'
})
]
};
Options
release [required]
- unique name of a release, can be either a string
or a function
which will expose you a compilation hash as it's first argument, which is 20-char long string, unique for a given codebaseinclude [required]
- string
or array
, one or more paths that Sentry CLI should scan recursively for sources. It will upload all .map
files and match associated .js
filesignoreFile [optional]
- string
, path to a file containing list of files/directories to ignore. Can point to .gitignore
or anything with same formatignore [optional]
- string
or array
, one or more paths to ignore during upload. Overrides entries in ignoreFile
file. If neither ignoreFile
or ignore
are present, defaults to ['node_modules']
configFile [optional]
- string
, path to Sentry CLI config properties, as described in https://docs.sentry.io/learn/cli/configuration/#properties-files. By default, the config file is looked for upwards from the current path and defaults from ~/.sentryclirc
are always loadedext [optional]
- string
, adds an additional file extension to be considered. By default the following file extensions are processed: js, map, jsbundle and bundle.urlPrefix [optional]
- string
, this sets an URL prefix in front of all files. This defaults to / but you might want to set this to the full URL. This is also useful if your files are stored in a sub folder. eg: --url-prefix '/static/js'validate [optional]
- boolean
, this attempts sourcemap validation before upload when rewriting is not enabled. It will spot a variety of issues with source maps and cancel the upload if any are found. This is not the default as this can cause false positives.stripPrefix | stripCommonPrefix [optional]
- string
, when paired with --rewrite
this will chop-off a prefix from uploaded files. For instance you can use this to remove a path that is build machine specific.sourceMapReference [optional]
- boolean
, this prevents the automatic detection of sourcemap references.rewrite [optional]
- boolean
, enables rewriting of matching sourcemaps so that indexed maps are flattened and missing sources are inlined if possible., defaults to true
You can find more information about these options in our official docs: https://docs.sentry.io/learn/cli/releases/#upload-source-maps