DESIGN

Using universal page templates to build sites faster: Join us next Tuesday

ContactSign Up for Free
Community Plugin
View plugin on GitHub

gatsby-plugin-webpack-statoscope

Gatsby plugin for the statoscope HTML-report from webpack-stats (@statoscope/webpack-plugin). The Statoscope webpack-plugin is developed by Statoscope.

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

Install

npm install gatsby-plugin-webpack-statoscope

How to use

Add the plugin to your gatsby-config file.

JavaScript:

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

TypeScript:

gatsby-config.ts
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.