easy-jsx-parser

easy-jsx-parser

Simple JSX tags parser that returns an easy to read object for every JSX tag

Install

$ npm i easy-jsx-parser

Usage

const jsxToObj = require('easy-jsx-parser');

jsxToObj('<Test myProp={true}>My Child</Test>');
/*=> '{ 
    Test: {
        myProp: true,
        children: 'My Child'
    }
}'*/

Features

• <Test />: Self-closing JSX tags
• <Test myProp="string">: String props
• <Test myProp={`string`}>: Template props
• <Test myProp>: True props
• <Test myProp={false}>: Boolean props
• <Test myProp={34}>: Number props
• <Test myProp={3 + 3 + 3}>: Props with arithmetic, comparison or bitwise operators
• <Test myProp={['Test', true, 34]}>: Arrays (with strings, numbers or booleans)
• <Test myProp={{ test: 34 }}>: Objects with string keys and string, number or boolean value
• <>Test</>: Fragments
• HTML/SVG DOM attributes are converted to correct React equivalent (class -> className)
• <Test myProp={(data)=>console.log(data)}>: Objects with string keys and arrow functions support
• <Nested><Child></Child></Nested>: Unlimited nested JSX tags support

License

MIT © Pablo Schaffner