what is the purpose of this transformer?

[urbanhop]

typescript supports tsx. isn't this enough to use typescript with infernojs? thx

[deamme]

Depends on your setup. The reason I made the custom transformer for Inferno was so I could use it with fuse-box and get rid of Babel as a dependency. You don't need this if e.g. you're using Babel and Webpack but you do need babel-plugin-inferno and ts-loader. An example on this setup can be seen here: https://github.com/infernojs/inferno-typescript-example

[urbanhop]

hmm, i love avoiding webback in particular. and every tool less is fine. but the typescript compiler already handles jsx (tsx), so couldn't we use just fuse-box and tsc without the need of a transformer?

ts transformation is underrated imho, and this is a nice example of a custom transformer. thx for providing this. i just would like to understand the transformation process implemented. is this a special kind of jsx transformation?

[deamme]

Inferno needs its own JSX transformation because it's different from React. That is why babel-plugin-inferno exist and ts-transform-inferno is its equivalent. If you look in https://github.com/deamme/ts-transform-inferno/tree/master/tests. You can see cases folder where all the tests cases are and that is its "input". If you then look in references folder you can see what it should transpile to and that is its "output".

For example we have this case (div.tsx):

<div></div>

And it should transpile to (div.jsx):

var Inferno = require("inferno");
var createVNode = Inferno.createVNode;
createVNode(2, "div");

The Typescript compiler already has this implemented for React but not for Inferno and that is why this custom Typescript transformer exist.

[urbanhop]

Ahh! This was the piece I was missing, did not know inferojs flavors jsx. Thank you so much for your time to explain this.