Skip to main content
The Stats object provides detailed information about the compilation process, including modules, chunks, assets, errors, and warnings.

Obtaining Stats

The Stats object is passed to the callback function after compilation:
const webpack = require('webpack');

webpack(config, (err, stats) => {
  if (err) {
    console.error(err);
    return;
  }
  
  // Use stats object here
  console.log(stats.toString({
    colors: true
  }));
});
Or via compiler hooks:
compiler.hooks.done.tap('MyPlugin', (stats) => {
  console.log('Compilation hash:', stats.hash);
});

Properties

compilation

Reference to the Compilation instance.
compiler.hooks.done.tap('MyPlugin', (stats) => {
  const compilation = stats.compilation;
  console.log('Modules:', compilation.modules.size);
  console.log('Chunks:', compilation.chunks.size);
});

hash

The compilation hash.
console.log('Build hash:', stats.hash);

startTime

Timestamp when compilation started.
console.log('Started at:', new Date(stats.startTime));

endTime

Timestamp when compilation ended.
const duration = stats.endTime - stats.startTime;
console.log('Build duration:', duration, 'ms');

Methods

hasErrors()

Returns true if the compilation had errors.
stats.hasErrors(): boolean
return
boolean
True if there were compilation errors, false otherwise.
Example:
webpack(config, (err, stats) => {
  if (err) {
    console.error(err);
    return;
  }
  
  if (stats.hasErrors()) {
    console.error('Build failed with errors');
    const info = stats.toJson();
    console.error(info.errors);
    process.exit(1);
  }
});

hasWarnings()

Returns true if the compilation had warnings.
stats.hasWarnings(): boolean
return
boolean
True if there were compilation warnings, false otherwise.
Example:
if (stats.hasWarnings()) {
  console.warn('Build completed with warnings');
  const info = stats.toJson();
  console.warn(info.warnings);
}

toJson()

Returns compilation information as a JSON object.
stats.toJson(options?: StatsOptions): StatsCompilation
options
StatsOptions
Options to control what information is included. Can be a string preset or an options object.Common presets:
  • 'normal' - Standard output (default)
  • 'minimal' - Only errors and warnings
  • 'errors-only' - Only errors
  • 'errors-warnings' - Only errors and warnings
  • 'verbose' - All information
  • 'none' - No information
return
StatsCompilation
Object containing compilation statistics with properties like:
  • hash (string) - Compilation hash
  • version (string) - webpack version
  • time (number) - Compilation time in ms
  • builtAt (number) - Build timestamp
  • publicPath (string) - Output public path
  • outputPath (string) - Output file system path
  • assets (Asset[]) - Array of asset objects
  • modules (Module[]) - Array of module objects
  • chunks (Chunk[]) - Array of chunk objects
  • entrypoints (Object) - Entry point information
  • errors (Error[]) - Array of errors
  • warnings (Warning[]) - Array of warnings
Example:
const statsJson = stats.toJson({
  all: false,
  assets: true,
  errors: true,
  warnings: true,
  timings: true
});

console.log('Assets:', statsJson.assets.map(a => a.name));
console.log('Time:', statsJson.time, 'ms');

if (statsJson.errors.length > 0) {
  console.error('Errors:', statsJson.errors);
}

toString()

Returns compilation information as a formatted string.
stats.toString(options?: StatsOptions): string
options
StatsOptions
Options to control output format. Can be a string preset or an options object.
return
string
Formatted string representation of the stats.
Example:
const output = stats.toString({
  colors: true,
  modules: false,
  children: false,
  chunks: false,
  chunkModules: false
});

console.log(output);

Stats Options

Detailed configuration for controlling stats output.

Common Options

const statsOptions = {
  // Basic options
  all: false,              // Fallback value for stats options (default: undefined)
  colors: true,            // Enable colored output
  
  // Assets
  assets: true,            // Show assets information
  assetsSort: 'size',      // Sort assets by: 'id', 'name', 'size', 'chunks'
  
  // Modules
  modules: true,           // Show modules information
  modulesSort: 'size',     // Sort modules
  maxModules: 15,          // Maximum number of modules to show
  
  // Chunks
  chunks: true,            // Show chunks information
  chunkModules: false,     // Show modules contained in chunks
  chunkOrigins: false,     // Show chunk origins
  
  // Depth
  depth: false,            // Show module depth in dependency graph
  
  // Entry points
  entrypoints: true,       // Show entry point information
  
  // Errors and warnings
  errors: true,            // Show errors
  errorDetails: true,      // Show details for errors
  warnings: true,          // Show warnings
  
  // Timing
  timings: true,           // Show timing information
  builtAt: true,           // Show build timestamp
  
  // Other
  hash: true,              // Show compilation hash
  version: true,           // Show webpack version
  publicPath: true,        // Show public path
  performance: true,       // Show performance hints
  reasons: false,          // Show reasons why modules are included
  source: false,           // Show source code of modules
  children: false          // Show stats for child compilations
};

const output = stats.toString(statsOptions);

Preset Configurations

// Minimal output - only errors and warnings
stats.toString('minimal');

// Errors only
stats.toString('errors-only');

// Errors and warnings
stats.toString('errors-warnings');

// Normal output (default)
stats.toString('normal');

// Verbose output - everything
stats.toString('verbose');

// No output
stats.toString('none');

Working with Stats Data

Analyzing Assets

webpack(config, (err, stats) => {
  if (err) return console.error(err);
  
  const json = stats.toJson();
  
  console.log('Total assets:', json.assets.length);
  
  // Find large assets
  const largeAssets = json.assets.filter(asset => asset.size > 100000);
  console.log('Large assets (>100KB):', largeAssets);
  
  // Group by type
  const assetsByType = {};
  json.assets.forEach(asset => {
    const ext = asset.name.split('.').pop();
    assetsByType[ext] = assetsByType[ext] || [];
    assetsByType[ext].push(asset);
  });
  
  console.log('Assets by type:', Object.keys(assetsByType));
});

Analyzing Modules

webpack(config, (err, stats) => {
  if (err) return console.error(err);
  
  const json = stats.toJson({ modules: true });
  
  console.log('Total modules:', json.modules.length);
  
  // Find modules from node_modules
  const nodeModules = json.modules.filter(module => 
    module.identifier.includes('node_modules')
  );
  console.log('Modules from node_modules:', nodeModules.length);
  
  // Calculate total size
  const totalSize = json.modules.reduce((sum, mod) => sum + mod.size, 0);
  console.log('Total modules size:', totalSize, 'bytes');
});

Analyzing Chunks

webpack(config, (err, stats) => {
  if (err) return console.error(err);
  
  const json = stats.toJson({ chunks: true });
  
  console.log('Total chunks:', json.chunks.length);
  
  json.chunks.forEach(chunk => {
    console.log(`Chunk ${chunk.id}:`);
    console.log('  Names:', chunk.names);
    console.log('  Size:', chunk.size);
    console.log('  Files:', chunk.files);
    console.log('  Entry:', chunk.entry);
    console.log('  Initial:', chunk.initial);
  });
});

Error Handling

webpack(config, (err, stats) => {
  // Fatal webpack errors (wrong configuration, etc)
  if (err) {
    console.error('Fatal error:', err.message);
    if (err.details) {
      console.error('Details:', err.details);
    }
    return;
  }
  
  const json = stats.toJson();
  
  // Compilation errors (missing modules, syntax errors, etc)
  if (stats.hasErrors()) {
    console.error('Compilation errors:');
    json.errors.forEach(error => {
      console.error(error.message);
      if (error.moduleName) {
        console.error('  in module:', error.moduleName);
      }
      if (error.loc) {
        console.error('  at location:', error.loc);
      }
    });
  }
  
  // Compilation warnings
  if (stats.hasWarnings()) {
    console.warn('Compilation warnings:');
    json.warnings.forEach(warning => {
      console.warn(warning.message);
    });
  }
});

Complete Example: Build Reporter

const webpack = require('webpack');
const config = require('./webpack.config.js');

webpack(config, (err, stats) => {
  if (err) {
    console.error('\n❌ Fatal error:');
    console.error(err.message);
    process.exit(1);
  }
  
  const json = stats.toJson({
    all: false,
    assets: true,
    modules: true,
    chunks: true,
    errors: true,
    warnings: true,
    timings: true
  });
  
  // Build info
  console.log('\n📦 Build Information:');
  console.log('  Hash:', json.hash);
  console.log('  Time:', json.time, 'ms');
  console.log('  Built:', new Date(json.builtAt).toLocaleString());
  
  // Assets summary
  console.log('\n📄 Assets:');
  json.assets.forEach(asset => {
    const sizeKB = (asset.size / 1024).toFixed(2);
    console.log(`  ${asset.name}: ${sizeKB} KB`);
  });
  
  // Chunks summary
  console.log('\n📦 Chunks:', json.chunks.length);
  json.chunks.forEach(chunk => {
    const sizeKB = (chunk.size / 1024).toFixed(2);
    console.log(`  ${chunk.names.join(', ') || chunk.id}: ${sizeKB} KB`);
  });
  
  // Modules summary
  console.log('\n📋 Modules:', json.modules.length);
  const totalSize = json.modules.reduce((sum, mod) => sum + mod.size, 0);
  console.log('  Total size:', (totalSize / 1024).toFixed(2), 'KB');
  
  // Errors
  if (stats.hasErrors()) {
    console.log('\n❌ Errors:', json.errors.length);
    json.errors.forEach((error, i) => {
      console.log(`\n  Error ${i + 1}:`);
      console.log('  ', error.message);
    });
    process.exit(1);
  }
  
  // Warnings
  if (stats.hasWarnings()) {
    console.log('\n⚠️  Warnings:', json.warnings.length);
    json.warnings.forEach((warning, i) => {
      console.log(`\n  Warning ${i + 1}:`);
      console.log('  ', warning.message);
    });
  }
  
  console.log('\n✅ Build completed successfully!\n');
});

TypeScript Types

import { Stats, StatsCompilation } from 'webpack';

const handleStats = (stats: Stats): void => {
  const json: StatsCompilation = stats.toJson({
    all: false,
    assets: true,
    errors: true,
    warnings: true
  });
  
  if (stats.hasErrors()) {
    console.error('Build failed');
    return;
  }
  
  console.log('Hash:', json.hash);
  console.log('Time:', json.time);
};

See Also