• Version 3.1.0
  • Published
  • 20.4 kB
  • 3 dependencies
  • ISC license


npm i webpack-bundle-size-analyzer
yarn add webpack-bundle-size-analyzer
pnpm add webpack-bundle-size-analyzer


A utility to find how your dependencies are contributing to the size of your Webpack bundles



function dependencySizeTree

dependencySizeTree: (stats: webpack_stats.WebpackStats) => RootStatsNode[];
  • Takes the output of 'webpack --json', and returns an array of trees of require()'d package names and sizes.

    There is one entry in the array for each bundle specified in the Webpack compilation.

function isMultiCompilation

isMultiCompilation: (stats: WebpackStats) => stats is WebpackMultiCompilation;

    function printDependencySizeTree

    printDependencySizeTree: (
    node: StatsNode,
    shareStats: boolean,
    depth?: number,
    outputFn?: (str: string) => void
    ) => void;
    • Walk a dependency size tree produced by dependencySizeTree() and output the size contributed to the bundle by each package's own code plus those of its dependencies.


    class WebpackBundleSizeAnalyzerPlugin

    class WebpackBundleSizeAnalyzerPlugin {}


      constructor(filepath?: string, statsOptions?: {});

        property filepath

        filepath: string;

          property statsOptions

          statsOptions: {};

            method apply

            apply: (compiler: any) => void;


              interface CompilationBase

              interface CompilationBase {}

                property errors

                errors: any[];

                  property hash

                  hash: string;

                    property name

                    name?: string;

                      property version

                      version: string;

                        property warnings

                        warnings: any[];

                          interface RootStatsNode

                          interface RootStatsNode extends StatsNode {}

                            property bundleName

                            bundleName?: string;

                              interface StatsNode

                              interface StatsNode {}
                              • A node in the package size tree

                              property children

                              children: StatsNode[];

                                property packageName

                                packageName: string;
                                • Name of the package. ie. 'foo' from 'node_modules/foo'

                                property size

                                size: number;
                                • Total size of files in this package, including its dependencies, in bytes.

                                interface WebpackAsset

                                interface WebpackAsset {}

                                  property chunkNames

                                  chunkNames: string[];

                                    property chunks

                                    chunks: number[];

                                      property emitted

                                      emitted: boolean;

                                        property name

                                        name: string;

                                          property size

                                          size: Bytes;

                                            interface WebpackChunk

                                            interface WebpackChunk {}

                                              interface WebpackCompilation

                                              interface WebpackCompilation extends CompilationBase {}
                                              • JSON structure produced for a single bundle generated by a Webpack compilation.

                                              property assets

                                              assets: WebpackAsset[];

                                                property assetsByChunkName

                                                assetsByChunkName: {
                                                [chunkName: string]: string;

                                                  property chunks

                                                  chunks: WebpackChunk[];

                                                    property modules

                                                    modules: WebpackModule[];

                                                      property time

                                                      time: Milliseconds;

                                                        interface WebpackModule

                                                        interface WebpackModule {}

                                                          property id

                                                          id: number;

                                                            property identifier

                                                            identifier: Path;

                                                              property name

                                                              name: string;

                                                                property size

                                                                size: Bytes;

                                                                  interface WebpackMultiCompilation

                                                                  interface WebpackMultiCompilation extends CompilationBase {}
                                                                  • JSON structure produced when Webpack config is an array of bundles.

                                                                  property children

                                                                  children: WebpackCompilation[];

                                                                    Type Aliases

                                                                    type Bytes

                                                                    type Bytes = number;

                                                                      type Milliseconds

                                                                      type Milliseconds = number;

                                                                        type Path

                                                                        type Path = string;

                                                                          type WebpackStats

                                                                          type WebpackStats = WebpackMultiCompilation | WebpackCompilation;
                                                                          • JSON structure of webpack --json output

                                                                          Package Files (4)

                                                                          Dependencies (3)

                                                                          Dev Dependencies (5)

                                                                          Peer Dependencies (0)

                                                                          No peer dependencies.


                                                                          To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                          You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/webpack-bundle-size-analyzer.

                                                                          • Markdown
                                                                          • HTML
                                                                            <a href="https://www.jsdocs.io/package/webpack-bundle-size-analyzer"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>