typescript-transform-jsx
Typescript transform jsx to string
Table of Contents
Motivation
- Typesafe templates
- Transform jsx to string in compilation time
- Fast runtime
See examples
Install
$ npm i -D typescript-transform-jsx
ttypescript
Usage withAdd it to plugins in your tsconfig.json
See https://github.com/LeDDGroup/typescript-transform-jsx/tree/master/examples/example-ttypescript
Setup
Set the jsx
flag to react-native
or preserve
in your tsconfig file. Then create a types.ts
with the following content:
declare
This will declare custom JSX so you don't need react typings.
Example
;
Gets compiled to:
const App = `<ul></ul>`;
Roadmap/Caveats
-
Always handle
children
property implicitly -
Self closing tags will be treated as such, (ie no children handling on the props)
-
Using spread operators on html elements require esnext environment because it compiles down to
Object.entries
expression:
// input;;// output;`<div ></div>`;
Contributing
If you have any question or idea of a feature create an issue in github or make an PR.