react-json-syntax-highlighter

Serialize javascript objects as highlighted, formatted json

Usage no npm install needed!

<script type="module">
  import reactJsonSyntaxHighlighter from 'https://cdn.skypack.dev/react-json-syntax-highlighter';
</script>

README

React json syntax highlighter

This is a simple React component that serializes a JavaScript object as highlighted json string.

Getting Started

Install react component:

npm install --save react-json-syntax-highlighter

Import the component in your file:

import ReactJsonSyntaxHighlighter from 'react-json-syntax-highlighter'

Use it in your React component:

class MyComponent extends React.Component {

  render() {
    const obj = {
      stringProp: 'bar',
      numberProp: 1,
      booleanProp: true,
      nullProp: null,
      nestedProp: {
        nestedPropBar: 'bar'
      }
    }    
    return <ReactJsonSyntaxHighlighter obj={obj} />
  }
}