Registry / devops / esbuild-visualizer

esbuild-visualizer

JSON →
library0.7.0jsnpmunverified

Visualize and analyze your esbuild bundle to determine module sizes and composition. Current stable version is 0.7.0, with irregular release cadence. Generates interactive HTML charts (treemap, sunburst, network) from esbuild metafiles. Key differentiator: works specifically with esbuild's metadata output, producing visual bundle analysis without including source code content. Requires Node >=18, ships TypeScript types. Alternative to webpack-bundle-analyzer for esbuild users.

npm install esbuild-visualizer
INSTALL
IMPORT
SIG · ESBUILD-VISUALIZER
E
esbuild-visualizer
devopsjavascriptv0.7.0
Install
Import
Disk
Pass rate
0/ 6
Env Coverage0 / 6
glibc
1822
musl
1822
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18223 runs
build_error
glibc
node 18223 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

visualizer
import { visualizer } from 'esbuild-visualizer'
import visualizer from 'esbuild-visualizer'
The package exposes a named export 'visualizer', not a default export.
visualizer
const { visualizer } = require('esbuild-visualizer')
const visualizer = require('esbuild-visualizer')
CommonJS require must destructure the named export.
type VisualizerOptions
import type { VisualizerOptions } from 'esbuild-visualizer'
import { VisualizerOptions } from 'esbuild-visualizer'
TypeScript users should use `import type` to avoid runtime import if not needed.
metafileName
// Not imported; usage: visualizer({ metafile: './meta.json', ... })
import { metafile } from 'esbuild-visualizer'
Options are passed as an object argument, not imported.

Builds an esbuild bundle with metafile, then generates an interactive treemap visualization HTML file.

import { visualizer } from 'esbuild-visualizer'; import { build } from 'esbuild'; async function analyze() { const result = await build({ entryPoints: ['app.ts'], bundle: true, outfile: 'out.js', metafile: true, }); // Write metafile to disk const fs = await import('fs'); fs.writeFileSync('meta.json', JSON.stringify(result.metafile)); await visualizer({ metafile: 'meta.json', filename: 'stats.html', title: 'My Bundle Analysis', template: 'treemap', // 'treemap', 'sunburst', or 'network' }); console.log('Visualization generated at stats.html'); } analyze().catch(console.error);
esbuild-visualizer --version
Debug
Known issues
gotchaThe visualizer function only works with esbuild metafiles (--metafile flag). If you pass a non-esbuild JSON, it will fail.
fix
Ensure the input JSON is produced by esbuild with { metafile: true } or the --metafile CLI flag.
affects: >=0.0.0
deprecatedOption 'metadata' (misspelled) was deprecated in v0.4.0 and removed in v0.5.0. Use 'metafile' instead.
fix
Use { metafile: ... } instead of { metadata: ... }.
affects: >=0.4.0 <0.5.0
gotchaGenerated HTML files do not contain source code, but they do include file paths and sizes. Avoid exposing these files if filesystem layout is sensitive.
fix
Review the generated stats.html before sharing; it contains statistical data but not source content.
affects: >=0.0.0
gotchaThe CLI command 'esbuild-visualizer' requires Node >=18. On older Node versions, it will fail to run.
fix
Use Node 18 or later.
affects: >=0.6.0
Errors
Common errors & fixes
Error: Could not find file: /path/to/meta.json
The metafile path provided does not exist or is incorrect.
fix
Verify the metafile path: visualizer({ metafile: './meta.json' }) after running esbuild with metafile: true.
TypeError: visualizer is not a function
The visualizer is not imported correctly; default import was used instead of named import.
fix
Use: import { visualizer } from 'esbuild-visualizer';
Error: Unknown template 'circlepacking'
An invalid template name was passed.
fix
Use one of: 'treemap', 'sunburst', 'network'.
Upgrade
Version history
0.7.0latest on npm
Audit
Dependencies
esbuildoptionalRequires esbuild's metadata output (--metafile flag) to generate visualizations.
Agent activity
2 hits · last 30 days
node
2
Resources
esbuild-visualizer — npm install esbuild-visualizer · libregistry