queckezz / fmt-obj

Stringifies any javascript object in your console for CLI inspection :sparkles:

fmt-obj

💄 Prettifies any javascript object in your console. Make it look awesome!

Screenshot

_{View Example}

Also check out the CLI version made by @Kikobeats

Features

• Circular reference support ✨
• Allows for custom formatting
• Supports any arbitrary javascript token (functions, strings, numbers, arrays, you name it!)

Installation

npm install --save fmt-obj

Or even better

yarn add fmt-obj

Import and Usage Example

const format = require('fmt-obj')

console.log(format({
  message: 'hello world',
  dev: true,
  awesomeness: 9.99,
  body: {
    these: null,
    are: 'string',
    some: 12,
    props: false
  }
}))

API

format(obj, depth = Infinity)

Prettifies obj with optional depth.

obj

Any arbitrary javascript object.

depth (optional)

Colapses all properties deeper than specified by depth.

createFormatter({ offset = 2, formatter = identityFormatter })

Create a custom format function if you need more control of how you want to format the tokens.

opts.formatter (optional)

fmt-obj uses chalk for it's default format function. A formatter is mostly used for colors but can be used to manipulate anything.

Example with rounding numbers

const format = createFormatter({ number: Math.round })
format({ num: 12.49 }) // -> num: 12

The following tokens are available:

• punctuation - The characters sorrounding your data: : and "
• literal - Either true, false, null or undefined
• annotation - Type annotation for errors, functions and circular references like [Function {name}]
• property
• string
• number

Example with a custom color map

const { createFormatter } = require('fmt-obj')

const format = createFormatter({
  offset: 4,

  formatter: {
    punctuation: chalk.cyan,
    annotation: chalk.red,
    property: chalk.yellow,
    literal: chalk.blue,
    number: chalk.green,
    string: chalk.bold
  }
})

opts.offset (optional)

The amount of left whitespace between the property key and all of it's sub-properties.

Similar packages

(Because package discovery is hard)

• pretty-format by @thejameskyle for additional ES6 type support (WeakMap, WeakSet, Symbol etc.) and more consistent output.

Author

fmt-obj © Fabian Eichenberger, Released under the MIT License.
Authored and maintained by Fabian Eichenberger with help from contributors (list).

GitHub @queckezz · Twitter @queckezz

fmt-obj's Issues

CLI version

What do you think about that?

Something like:

fmt package.json

Better array support.

It would be great if the package descended into arrays and printed the formated output of each element rather than .join-ing their string representations. Ideally an array of objects would print the fully formatted value of each object indented further.

Consider the differences shown below.

Using fmt-obj: on {asdf: [{a: 3, b: 4}, {x: 10}]}

  
    asdf: "[object Object],[object Object]"

Using the prettyjson library:

asdf: 
  - 
    a: 3
    b: 4
  - 
    x: 10

2 minor things

1. Shouldn't readme customFormat example contain Infinity as the 2nd param?

const customFormat = (...args) => format(...args, Infinity, {
  punctuation: chalk.cyan,
  annotation: chalk.red,
  property: chalk.yellow,
  literal: chalk.blue,
  number: chalk.green,
  string: chalk.bold
})

2. If you don't provide one of the color properties, it throws this. Can you merge with the default object?

TypeError: formatter.punctuation is not a function
    at .../node_modules/fmt-obj/dist.js:82:114

Better Circular Reference Displays

Objects with circular references display (collapsed) on these references rather than displaying a representation of the circular relationship.

Consider using a library like ciruclar-json or something else to handle these cases.

Consider the following output below:

Using fmt-obj on an object with a circular reference:
Note that object.b.z points back to the root object, and object.d points to .b.c.e

  
    a: 3
    b: 
       x: 10
       z: (collapsed)
       c: (collapsed)
    d: 
       foo: "bar"

Using prettyjson and circular-json together on the same object:

a: 3
b: 
  x: 10
  z: ~
  c: 
    e: 
      foo: bar
d: ~b~c~e

offset depth elements

Looks like is not apply for all the elements

with offset = 2:

❯ node examples/formatter.js

  hello: "world"
    foo: "bar"
   deep:
         foo: "bar"
         arr:
              0: 1
              1: 2
              2: 3
              3: 4
              4: 5

with offset = 4:

❯ node examples/formatter.js

    hello: "world"
      foo: "bar"
     deep:
           foo: "bar"
           arr:
                0: 1
                1: 2
                2: 3
                3: 4
                4: 5

pretty-format

Hey, I wrote a package a little while back called pretty-format. I was wondering if you'd seen it and if there was something it does not do you wish it did.

https://github.com/facebook/jest/tree/master/packages/pretty-format