This is plugin for glimmer-x
project, allow to work with .jsx/tsx
templates in components.
How to use it?
1.) Install plugin yarn add babel-plugin-glimmerx-jsx-templates --dev
2.) Install jsx
syntax plugin yarn add @babel/plugin-syntax-jsx --dev
{
"plugins": ["@babel/plugin-syntax-jsx", "babel-plugin-glimmerx-jsx-templates"]
}
class MyJSXComponent extends Component {
firstName = "Bob"
static template({ lastName }) {
return <div>{this.firstName} { lastName }</div>;
}
}
class MyJSXComponent extends Component {
firstName = "Bob";
static template = hbs`<div>{{this.firstName}} {{@lastName}}</div>`;
}
For more jsx
compilation information take alook at: