Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub


Gatsby plugin for the statoscope HTML-report from webpack-stats (@statoscope/webpack-plugin). The Statoscope webpack-plugin is developed by Statoscope. This plugin is an alternative to gatsby-plugin-webpack-bundle-analyser-v2 which also allows you to visualize the size of output files with an interactive zoomable treemap.

Consider reading Statoscope: A Course Of Intensive Therapy For Your Bundle to learn more.

gatsby-plugin-webpack-statoscope is released under the MIT license. Current npm package version. Downloads per month on npm. Total downloads on npm. Website Follow @lekoarts_de


npm install gatsby-plugin-webpack-statoscope

How to use

Add the plugin to your gatsby-config file.


module.exports = {
  plugins: [
      resolve: `gatsby-plugin-webpack-statoscope`,
      options: {}


import type { GatsbyConfig, PluginRef } from "gatsby"
import type { PluginOptions as StatoscopePluginOptions } from "gatsby-plugin-webpack-statoscope"

const config: GatsbyConfig = {
  plugins: [
      resolve: `gatsby-plugin-webpack-statoscope`,
      options: {} as StatoscopePluginOptions,
  ] as PluginRef[],

export default config

Now run gatsby build. A browser window will automatically open with the Statoscope UI. The output will be placed into the public/.statoscope folder.

When enabling the watchMode option you can also use this plugin with gatsby develop.

Plugin Options

All options for @statoscope/webpack-plugin are passed through. Read its usage section to learn more.

By setting the saveReportTo and saveStatsTo options you can overwrite the default public/.statoscope location.

© 2023 Gatsby, Inc.