PostHTML JSX

Install

npm i -D posthtml-jsx

Usage

posthtml(plugins)
  .process(html, { render: jsx(options) })
  .then(({ html }) => console.log(html))

Options

type: {String}: Type of the Component ( es5 || es2015 || stateless )

name: {String}: Name of the Component

props: {String|Array}: Props of the Component

export: {Boolean}: Export Component JS Module (true || false)

Example

import { readFileSync, writeFileSync } from 'fs'

import posthtml from 'posthtml'
import jsx from 'posthtml-jsx'

const html = readFileSync('./index.html', 'utf8')

posthtml()
  .process(html, {
    render: jsx({
      type: 'es2015'
      name: 'Test'
      props: ['prop', '{ prop }', '...props']
      export: true
    })
  })
  .then((result) => writeFileSync('./Test.jsx', result.html, 'utf8'))

<div id={id} class={container}>
  {content}
</div>

import { Component } from 'react'

class Test extends Component {
  render (prop, { prop }, ...props) {
    return (
      <div id={test.id} className={test.class}>
        {test.content}
      </div>
    )
  }
}

export default Test

Maintainers

Contributing

See PostHTML Guidelines and CONTRIBUTING.

LICENSE

MIT