Registry / devops / metro-visualizer

metro-visualizer

library0.56.4jsnpmunverified

Suite of visual analysis tools for the Metro bundler. Version 0.56.4, released alongside React Native 0.64.0. Provides an interactive web-based dashboard to inspect bundle sizes, dependency graphs (with search and pathfinding), and build performance metrics. Differentiators: real-time build stats, module search and path visualization, customizable graph display. Requires Metro 0.56.3 and related packages.

devops web-framework

npm install metro-visualizer

package ↗

INSTALL

IMPORT

SIG · METRO-VISUALIZER

metro-visualizer

devopsjavascriptv0.56.4

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

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 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

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

enableVisualizer

✓ server: { enableVisualizer: true }

✗ module.exports = { enableVisualizer: true }

Set in metro.config.js under server option, not top-level.

Enables the visualizer in Metro config and installs the package. After starting Metro, visit the visualizer endpoint.

// metro.config.js module.exports = { server: { enableVisualizer: true } }; // Install with npm install metro-visualizer --save // Run metro: npx react-native start // Open http://localhost:8081/visualizer in browser

Debug

Known issues

gotchaVisualizer only works when Metro runs in development mode. Production builds do not enable the endpoint.

fix

Ensure you run metro with NODE_ENV=development or without --production flag.

affects: >=0.56.0 <1.0.0

gotchaenableVisualizer must be set before Metro server starts. Changing config while server is running requires a restart.

fix

Restart Metro after changing config.

affects: >=0.56.0

deprecatedMetro Visualizer for versions 0.56.x may not be compatible with React Native 0.69+ due to Metro API changes. Consider using newer alternatives like @rnx-kit/metro-service or React Native bundle inspector.

fix

Upgrade to a compatible version or use official Metro debugging tools.

affects: 0.56.x

Errors

Common errors & fixes

Error: Cannot find module 'metro-visualizer'

Package not installed or missing from node_modules.

fix

Run npm install metro-visualizer --save

Error: Server options must be an object

metro.config.js exports a function instead of an object, or server config is misplaced.

fix

Export a plain object with server: { enableVisualizer: true }. If using a function, return that object.

Cannot GET /visualizer

Visualizer endpoint not available; either not enabled or Metro is running in production mode.

fix

Check metro.config.js has enableVisualizer: true under server, and restart Metro in development mode.

Upgrade

Version history

0.56.4latest on npm

Audit

Dependencies

metrorequiredCore bundler; visualizer hooks into Metro server

metro-babel-registerrequiredEnables Babel transpilation for Metro config and modules

metro-corerequiredProvides core types and utilities for Metro plugins

Agent activity

7 hits · last 30 days

node

Amazon

Resources

packagehttps://www.npmjs.com/package/metro-visualizer ↗