Site Tools

You are here: Start » React.JS » TypeScript integration

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Next revision		Previous revision
reactjs:typescript-integration [2015-02-17] – created dcaireactjs:typescript-integration [2020-04-19] (current) – external edit 127.0.0.1
Line 1: Line 1:
 +===== TypeScript integration =====
  
 +I found it's a bit hacky to create React.JS components in TypeScript, mainly because TypeScript doesn't understand JSX, you could use React DOM APIs to create element, but this gonna become unreadable when rendering complex structure.
 +
 +The workaround is using ts-jsx-loader created by James brantly: https://github.com/jbrantly/ts-jsx-loader.
 +
 +The idea is  creating a fake API React.jsx(), it wraps the JSX, and the loader would  translate it into React.createElement() calls.
 +
 +There also a project attampts to make typescript understands JSX: https://github.com/ripieno/typescript-react-jsx, but it doesn't seem to be active.
 +
 +  * Reference: [[https://www.youtube.com/watch?v=9PTa9-PPVAc|React.js Conf 2015 - Static typing with Flow and TypeScript]]
 +  * Helper: [[https://github.com/Asana/typed-react/]]

Page Tools

User Tools