JarCastingpretty-print-json
JavaScript library to pretty-print JSON data to HTML for formatted color display
1) Try it out
Interactive online tool to format JSON:
https://pretty-print-json.js.org
2) Setup
Browser
Load from the jsdelivr.com CDN:
<link rel=stylesheet href=https://cdn.jsdelivr.net/npm/pretty-print-json@0.3/dist/pretty-print-json.css>
...
<script src=https://cdn.jsdelivr.net/npm/pretty-print-json@0.3/dist/pretty-print-json.min.js></script>
node
Install package from npm:
$ npm install pretty-print-json
Import into your application:
const prettyPrintJson = require('pretty-print-json');
3) Usage
API
const html = prettyPrintJson.toHtml(data[, options]);
Example
HTML:
<pre id=account></pre>
JavaScript:
Pass data into prettyPrintJson.toHtml() and display the results.
const data = { active: true, mode: '🚃', codes: [48348, 28923, 39080], city: 'London' };
const elem = document.getElementById('account');
elem.innerHTML = prettyPrintJson.toHtml(data);
Options
| Name (key) | Type | Default | Description |
|---|---|---|---|
indent |
integer | 3 |
Number of spaces for indentation. |
linkUrls |
boolean | true |
Create anchor tags for URLs. |
quoteKeys |
boolean | false |
Always double quote key names. |
4) Contributor notes
To be a contributor, fork the project and run the commands npm install and npm test on your local clone. Make your edits and rerun the tests. Pull requests welcome.
Pull requests (PRs) should not update the version number in package.json or any files in the dist folder. The version number and dist files are all updated as part of the release process.
Issues labeled "good first issue" make it easy for first time contributors to participate. Only submit a PR for one of these issues if you're new to this project.
Feel free to submit questions at:
github.com/center-key/pretty-print-json/issues
