babel-plugin-transform-jsx-to-html

Transform jsx to html string for better ssr performance.

Installation

npm install --save-dev babel-plugin-transform-jsx-to-html

Usage

Via .babelrc

.babelrc

{
  "plugins": [
    "babel-plugin-transform-jsx-to-html",
    "babel/plugin-transform-react-jsx"
  ]
}

Example

basic example

Your component.js that contains this code:

import { createElement, Component } from 'rax';

class App extends Component {
  render() {
    return <div className="header" />
  }
}

Will be transpiled like this:

import { createElement, Component } from 'rax';

class App extends Component {
  render() {
    return [{
      __html: '<div class="header" />'
    }];
  }
}

These pre transpiled html can be used in server renderer, like rax-server-renderer

more examples

input

<div>
  <View />
</div>

output

[{
   __html: "<div>"
}, 
createElement(View, null),
{
  __html: "</div>"
}]

input

<div className="container" style={style} onClick={onClick}>
  <div>a {props.index}</div>
</div>

output

[{
  __html: "<div class=\"container\""
}, {
  __attrs: {
    style: style,
    onClick: onClick
  }
}, {
  __html: "><div>a "
}, props.index, {
  __html: "</div></div>"
}]

Current Tags

• 0.2.1-beta.9                                ...           beta (3 years ago)
• 0.2.1                                ...           latest (4 years ago)

13 Versions

• 0.2.1-beta.9                                ...           3 years ago
• 0.2.1-beta.8                                ...           3 years ago
• 0.2.1-beta.7                                ...           3 years ago
• 0.2.1-beta.6                                ...           3 years ago
• 0.2.1-beta.5                                ...           3 years ago
• 0.2.1-beta.4                                ...           3 years ago
• 0.2.1-beta.3                                ...           3 years ago
• 0.2.1-beta.2                                ...           3 years ago
• 0.2.1-beta.1                                ...           3 years ago
• 0.2.1                                ...           4 years ago
• 0.2.1-beta.0                                ...           4 years ago
• 0.2.0                                ...           5 years ago
• 0.1.0                                ...           5 years ago