npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

source-map-viewer

v0.3.2

Published

Inspect and debug source map mappings from the terminal

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Git

Maintainers

dengqingdengqing

Keywords

Readme

source-map-viewer

Inspect and debug source map mappings from the terminal.

The CLI uploads a source map to source-map-viewer.void.app, opens the interactive viewer in your browser, or prints an AI-friendly Markdown report locally. It accepts either a file path or a folder that contains one unambiguous source map entrypoint.

Usage

Run it with vp dlx in a Vite+ workspace, or npx elsewhere:

vp dlx source-map-viewer bundle.js
vp dlx source-map-viewer dist/
vp dlx source-map-viewer bundle.js --url
vp dlx source-map-viewer bundle.js --ai
vp dlx source-map-viewer bundle.js --copy

vp dlx source-map-viewer compare before.js after.js
vp dlx source-map-viewer compare before.js after.js --url
vp dlx source-map-viewer compare before.js after.js --ai

npx source-map-viewer bundle.js
npx source-map-viewer bundle.js --url
npx source-map-viewer bundle.js --ai
npx source-map-viewer compare before.js after.js --url

Commands

source-map-viewer <path>                        Upload a file or folder and open in browser
source-map-viewer <path> --url                  Print shareable URL only
source-map-viewer <path> --ai                   Print markdown debug report (offline)
source-map-viewer compare <pathA> <pathB>       Compare two source maps in browser
source-map-viewer compare <pathA> <pathB> --url Print compare URL only
source-map-viewer compare <pathA> <pathB> --ai  Print diff report to stdout

Input Resolution

You can pass generated code, a source map file, or a folder.

  • Generated code files: the CLI looks for an inline sourceMappingURL, an external .map reference, or a sibling .map file.
  • Source map files: the CLI tries to find the generated file next to the map or via the source map file field.
  • Folder inputs: the CLI recursively scans the folder, requires exactly one source map entrypoint, and uses the folder structure to hydrate missing sourcesContent where possible.
  • Compare mode: both sides accept the same input formats.

Supported generated file extensions are .js, .ts, and .css. Supported source map file extensions are .map and .json.

Options

  • --url or --no-open: print the resulting URL instead of opening a browser
  • --ai: print an offline Markdown debug report to stdout
  • --copy: copy the URL or Markdown report to the clipboard
  • --host <url>: use a custom deployment instead of https://source-map-viewer.void.app
  • -h, --help: show help

Examples

Open a visualization in your browser:

source-map-viewer dist/app.js

Print a shareable URL:

source-map-viewer dist/app.js --url

Generate a Markdown report for an AI tool:

source-map-viewer dist/app.js --ai | pbcopy

Compare two source maps without opening a browser:

source-map-viewer compare before.js after.js --ai

Project

This package is the CLI for the Source Map Viewer project.