jmshal / webpack-bugsnag-plugin

A collection of webpack plugins for integrating with Bugsnag

Webpack Bugsnag Plugin(s)

This module contains webpack plugins to help ease Bugsnag into your webpack build process.

Install

The Bugsnag plugins are available on npm, you can install them into your project by running the following command in the root of your project.

$ npm i --save-dev webpack-bugsnag-plugin

Usage

const {
  BugsnagDeployPlugin,
  BugsnagSourceMapPlugin
} = require('webpack-bugsnag-plugin');

module.exports = {
  devtool: 'source-map',
  // ...
  plugins: [
    // WebpackS3Plugin(...)
    new BugsnagDeployPlugin({
      apiKey: 'e48e13207341b6bffb7fb1622282247b',
      releaseStage: 'production',
      appVersion: '1.7.0',
    }),
    new BugsnagSourceMapPlugin({
      apiKey: 'e48e13207341b6bffb7fb1622282247b',
      publicPath: 'http*://*example.com/build',
      appVersion: '1.7.0',
    }),
  ],
};

BugsnagSourceMapPlugin

Check out https://docs.bugsnag.com/api/js-source-map-upload/ for more information about uploading sourcemaps to Bugsnag.

The BugsnagSourceMapPlugin plugin automatically uploads your bundle sourcemaps to Bugsnag, so when errors occur within your application you see the original source code right within your Bugsnag dashboard.

Options

Option	Description	Required	Default
apiKey	Your Bugsnag project API key. You can find this key from within your project's settings page.	*	n/a
publicPath	The url of your minified bundle(s). This option supports wildcards (eg. http*://example.com if your bundle is served from HTTP & HTTPS).	*	output.publicPath
appVersion	The version of your app your bundle relates to. This option is automatically calculated from your package.json if one exists.		**
overwrite	If you have already pushed sourcemap files to Bugsnag for a particular version of your app, you can pass this option to replace it.		false
endpoint	For Bugsnag Enterprise, this is your custom endpoint to send sourcemaps to. Omit this option if you're not using Bugsnag Enterprise.		https://upload.bugsnag.com

** These options automatically default to information within your project's package.json file, or your local Git repository.

BugsnagDeployPlugin

Check out https://docs.bugsnag.com/api/deploy-tracking/ for more information about Bugsnag deploy tracking.

The BugsnagDeployPlugin plugin automatically pushes deploy events to Bugsnag when your webpack bundle builds successfully. This makes it easy from your Bugsnag dashboard when you deployed changes to your app, and the impact it had on the number of errors have occurred since.

Options

Option	Description	Required	Default
apiKey	Your Bugsnag project API key. You can find this key from within your project's settings page.	*	n/a
releaseStage	The environment in which the deployed occurred (eg. production, testing, development).		production
repository	The Git repository which contains the source code being deployed.		**
provider	If your repository is hosted on a on-premise solution, you will need to supply the provider (eg. github-enterprise, bitbucket-server, gitlab-onpremise).
branch	The source control branch from which you are deploying the code. Only relevant when repository is supplied.		**
revision	The source control revision id for the code you are deploying. Required when repository is supplied.		**
appVersion	The app version of the code you are currently deploying. Only set this if you tag your releases with semantic version numbers and deploy infrequently.		**

** These options automatically default to information within your project's package.json file, or your local Git repository.

License

MIT License ❤️

webpack-bugsnag-plugin's Issues

Query strings in output file names are not supported

In my webpack.config, I specify a query string on the output files like so:

output: {
  filename: 'js/[name].js?[chunkhash:20]',
  chunkFilename: 'js/[name].chunk.js?[chunkhash:20]',
  path: path.resolve(__dirname, buildDir)
},

This naming convention results in the BugsnagSourceMapPlugin to not find any of my sourcemaps.

After glancing at your code, I noticed the reason the plugin couldn't find my sourcemaps was due to the regex used on the chunk.files here:
https://github.com/jmshal/webpack-bugsnag-plugin/blob/master/src/BugsnagSourceMapPlugin.js#L40-L41

The ability to support files with query strings can be done by mapping the file names before filtering, so that the query is stripped out. Something like this:

const filesWithoutQuery = chunk.files.map((file) => file.split('?')[0]);

and filtering based on those mapped file names. Or updating the regex to account for query strings and then stripping out the query part before upload.

Configuration to change the file tests

React native expects a bundle file named index.bundle, so when using webpack, e.g. through https://github.com/callstack/haul, the bundle output file is not uploaded.
I'm working around this by patching #getSourceMaps(), but it would be nice to be able to configure it, e.g. SourceMapDevToolPlugin test option.

Warn, but don't fail, on duplicate map found

When deploying (via netlify in my case but other CIs probably similar) with a change that doesn't include JS modifications, the source map is the same and it errors and fails with this error:

5:10:55 PM: Conflict (409) - duplicate source map file for https://5calls.org/static/js/main.bcc4c028.js
5:10:55 PM: error Command failed with exit code 1.

This causes the whole deploy to fail even though this isn't a fatal issue. This particular error should probably be caught and warned, but not outright failed.

I'm also using overwrite: true because I figured it would at least sidestep the issue, but it does not appear to.

Git commands permission denied makes build fail

So, I'm using Netlify to deploy my app. They have permissions that don't allow git commands. I tried to set some options manually to avoid having to get them with Git (I won't be able to set revision though):

new BugsnagDeployPlugin({
  apiKey: '...',
  releaseStage: 'production',
  repository: '...',
  branch: 'prod'
}),

But it's still trying to run some Git commands that fail from the getProjectDetails function. Is there any way to make the functions in git helper more resistant to errors? I tried a few things without success...

Thanks.

`git remote get-url origin` fails with Git <2.7

This command isn't available with git <2.7: https://stackoverflow.com/questions/4089430/how-can-i-determine-the-url-that-a-local-git-repository-was-originally-cloned-fr

Failed on my machine, updated Git, works great. But I'm using Netlify and it looks like their build system is also using an older Git version. I'll let them know but I guess they won't be able to update it soon. Could you use a more compatible command like git config --get remote.origin.url?

Thanks.

Bump the package version

please :)

API key validation error not specific enough

The error you get when you put in an invalid api key is

You must provide your Bugsnag API key to the BugsnagPlugin.

But I did provide an api key, it was just a fake one that wasn't long enough. It should be more clear and specify that it failed validation, not that it's missing.

Add option to remove source maps after upload

For builds that use hidden source maps and do not distribute/archive these, might be useful to provide an option to have these removed from the assets once upload completes.