Webpack Plugin

Raygun Webpack Plugin Documentation

The Raygun Webpack Plugin automates the upload of your source maps to Raygun, enhancing your debugging process by tracing minified code back to its original state. This guide will walk you through installing, configuring, and using the Raygun Webpack Plugin.

Ensure you have Node.js and npm installed. Run the following command in your project root to install the plugin:

npm install @raygun.io/webpack-plugin --save-dev

After installation, set up the plugin in your Webpack configuration file as follows:

  1. Import the Plugin: At the top of your Webpack config file, import the RaygunWebpackPlugin:

    const { RaygunWebpackPlugin } = require('@raygun.io/webpack-plugin');
  2. Configure Plugin Options: Create an instance of the plugin with your specific Raygun options:

    const raygunPlugin = new RaygunWebpackPlugin({
        applicationId: 'YOUR_APPLICATION_ID',  // Your Raygun application ID
        patToken: 'YOUR_PAT_TOKEN',            // Your Personal Access Token from Raygun
        baseUri: 'http://localhost:3000/'      // Base URI for your web application

    Note: The Personal Access Token needs the cr.source-maps:write permission. Generate one here. Use environment variables to manage sensitive information securely.

  3. Add Plugin to Webpack Configuration: Include the RaygunWebpackPlugin instance in your Webpack configuration's plugins array:

    module.exports = {
        plugins: [
            // Other plugins

The plugin automatically uploads source maps to Raygun when your project builds, triggered by Webpack's emit event. No further action is required. Build your project as usual:

npm run build


webpack --config your-webpack-config.js
  • Confirm your applicationId and patToken are correct.
  • Check network connectivity to https://api.raygun.com.
  • Look for console errors during the upload process.

For further assistance, consult the documentation or reach out to the support team.