vite-bundle-visualizer

1.2.1 verified Sat Apr 25 auth: no javascript

Vite-bundle-visualizer v1.2.1 is a CLI tool to visualize Vite bundle sizes using rollup-plugin-visualizer. It generates interactive treemap, sunburst, network, raw data JSON, or list views. Unlike rollup-plugin-visualizer (a Vite plugin), this is a standalone CLI that runs `vite build` internally, so no plugin config needed. It requires Node ^18.19.0 || >=20.6.0, is ESM-only since v1.0.0, ships TypeScript types, and is actively maintained with monthly releases.

Common errors

error Error: Cannot find module 'vite-bundle-visualizer' ↓

cause Package not installed locally; npx may not find it if not in PATH.

fix

Run 'npm install -D vite-bundle-visualizer' or use 'npx vite-bundle-visualizer'.

error Error [ERR_REQUIRE_ESM]: require() of ES Module not supported ↓

cause Using require() in CommonJS environment for ESM-only package.

fix

Use import() dynamic import, or switch project to ESM, or use npx.

error Error: Unknown argument: json ↓

cause Used deprecated -t json instead of -t raw-data.

fix

Change to '--template raw-data' or '-t raw-data'.

Warnings

breaking Package is ESM-only since v1.0.0. Cannot require() in CommonJS. ↓

fix Ensure your project uses ESM (package.json type: module) or use npx.

deprecated --template json is deprecated; use --template raw-data instead. ↓

fix Replace -t json with -t raw-data.

gotcha Requires Node.js >=18.19.0 || >=20.6.0 due to dependency on modern Vite versions. ↓

fix Upgrade Node.js to a supported version.

gotcha CLI runs vite build internally; your project must have a valid Vite config. ↓

fix Ensure vite.config.js exists or specify with -c.

Install

npm install vite-bundle-visualizer

yarn add vite-bundle-visualizer

pnpm add vite-bundle-visualizer

Imports

default (CLI)
wrong
```
npx vite-bundle-visualizer --template json (use 'raw-data' instead)
```
correct
```
npx vite-bundle-visualizer
```
CLI only, no programmatic API. 'json' template was renamed to 'raw-data' in v0.11.0.
viteBundleVisualizer (if programmatic)
wrong
```
import viteBundleVisualizer from 'vite-bundle-visualizer'
```
correct
```
Not available - CLI only
```
This package has no programmatic export; use npx or install globally.

Quickstart

Generates a treemap visualization of your Vite bundle with sourcemap-based sizes, outputting stats.html.

npx vite-bundle-visualizer -o stats.html -t treemap --sourcemap