@bengourley/source-map-decoder

@bengourley/source-map-decoder

Parse a source map and output the data in a way that makes sense to humans

This started life as a gist for the purpose of this blog post.

It reads a source map, and outputs an object with a similar structure, replacing the VLQ mappings property with a human-readable format:

"mappings": {
  "0": [
   ^
   └── the line number of the output file

    "231 => source.js 5:64 foo"
      ^        ^       ^    ^
      │        │       │    └── the symbol name from the source file
      │        │       │
      │        │       └── the line:column position in the source file
      │        │
      │        └── the name of the source file
      │
      └── the column number of the output file

  ]
}

Installation

npm i -g @bengourley/source-map-decoder

Usage

cat my-source-map.js.map | decode-source-map

This will output some not very pretty JSON so I recommend combining it with the jq tool (available on a mac with brew install jq) to pretty-print and colourise the output:

cat my-source-map.js.map | decode-source-map | jq .

The above command will pretty print the entire source map structure, potentially including all sources. So to just view the mappings property, use jq's selector interface:

cat my-source-map.js.map | decode-source-map | jq .mappings

License

ISC