svelte-debugger (demo 🚀)

A JSON debugger component for Svelte apps.

Installation

Install with npm:

npm install svelte-debugger --save

install with yarn:

yarn add svelte-debugger

Usage

<script>
  import Debugger from 'svelte-debugger';

  // This variable is used for the example below
  const example = {
    "id": 1,
    "name": "Leanne Graham",
      "address": {
        "street": "Kulas Light",
        "zipcode": 92998,
        "timezone": null
      },
      "company": {
        "name": "Romaguera-Crona",
        "registered": false,
        "daylightSaving": true,
      }
    };
</script>

<Debugger data={example} />

Properties

<Debugger
  data={example}
  indent={2}
  colorOptions={{ falseColor: '#ff3e00', trueColor: '#40b3ff' }}
/>

Parameters

The following parameters are available:

| parameter | default | description | | ------------ | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | data | {} | The non-formated object to format | | indent | 2 | The size number of spaces between keys and values | | colorOptions | {} | An object that describes the individual color of each property (keyColor, numberColor, stringColor, trueColor, falseColor, nullColor) from our data object |

License

MIT