Skip to content
πŸ¦‹ JavaScript library to pretty-print JSON data to HTML for formatted color display
JavaScript HTML Shell CSS
Branch: master
Clone or download
Latest commit b7a4d2c Jun 2, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist Release v0.1.0 Apr 27, 2019
docs πŸ¦‹ Jun 2, 2019
spec πŸ¦‹ Jun 2, 2019
.gitignore Project setup Nov 18, 2018
.travis.yml Enable travis ci Nov 18, 2018
LICENSE.txt Let npm know location of css file Jan 7, 2019
README.md Release v0.1.0 Apr 27, 2019
gulpfile.js Next release Feb 10, 2019
package.json πŸ¦‹ Jun 2, 2019
pretty-print-json.css Separate spec folder Dec 30, 2018
pretty-print-json.js Fix for quotes inside of quotes Feb 10, 2019
task-runner.sh.command Update to mocha 6.0 Mar 22, 2019

README.md

pretty-print-json

logo

JavaScript library to pretty-print JSON data to HTML for formatted color display

License:MIT npm Dependencies Vulnerabilities Build

screenshot

Try it out

Interactive online tool to format JSON:
https://pretty-print-json.js.org

Setup

Browser

Load from the jsdelivr.com CDN:

<link rel=stylesheet href=https://cdn.jsdelivr.net/npm/pretty-print-json@0.1/dist/pretty-print-json.css>
...
<script src=https://cdn.jsdelivr.net/npm/pretty-print-json@0.1/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');

Usage

Example HTML:

<pre id=account></pre>

Pass data into prettyPrintJson.toHtml() and display the results:

const data = { active: true, codes: [48348, 28923, 39080], city: 'London' };
$('#account').html(prettyPrintJson.toHtml(data));

MIT License | Blog post

You can’t perform that action at this time.