babel-plugin-transform-jsx-html v1.0.0

Transforms JSX to HTML

Using this simple Babel plugin you can use JSX syntax to write inline HTML templates for Vue components. The plugin searches for JSX parent elements and if an callee name is t replaces callee and JSX with the same JSX but in a string.

Usage

{
  "presets": ["es2015"],
  "plugins": ["transform-jsx-html"]
}

Example

The plugin transforms the following code:

Vue.component( 'component', {
	template: t(
		<div>
			<input type='checkbox' v-model='show' />
			<pre v-if='show' >Hello!</pre>
		</div>
	)
} );

to the following code:

Vue.component( 'component', {
	template: '<div><input type=\'checkbox\' v-model=\'show\' /><pre v-if=\'show\'>Hello!</pre></div>'
} );