forcewake Sep 11 2015 at 12:35

Использование React JSX вместе с TypeScript 1.6

7 min

45K

JavaScript*ReactJS*TypeScript*Website development*

Tutorial

From sandbox

+14

Comments 5

nik_the_spirit Sep 11 2015 at 12:43

От использования такой связки меня отделяла только плохая поддержка IDE. Но к счастью VS Code 0.8, Atom и Sublime с plug-in уже умеют подсветку и автокомплит. Жду не дождусь когда поддержка TSX появится в моем любимом WebStorm и будет счастье.

msd Sep 23 2015 at 14:37

В ближайшем WS 11 EAP :)

easimonenko Jan 21 2016 at 23:30

Эта строчка кода не компилируется:

React.render(React.createElement(Main), document.getElementById('main'));

Свойства 'render' нет в React.

easimonenko Jan 21 2016 at 23:40

Частично разобрался с проблемой: у автора версия React 0.13.3, а у меня 0.14. У них разные API в typings. В новой версии отсутствует вот этот фрагмент:

function render<P>(
        element: DOMElement<P>,
        container: Element,
        callback?: () => any): DOMComponent<P>;
    function render<P, S>(
        element: ClassicElement<P>,
        container: Element,
        callback?: () => any): ClassicComponent<P, S>;
    function render<P, S>(
        element: ReactElement<P>,
        container: Element,
        callback?: () => any): Component<P, S>;

Осталось разобраться, что с этим всем делать дальше…

easimonenko Jan 22 2016 at 00:05

Разобрался с проблемой: в версии 014 часть API модуля React вынесена в модуль ReactDOM. Поэтому ещё нужно добавить в проект поддержку ReactDOM, и всё заработает.

1. Установить пакет react-dom:

npm install react-dom --save

2. Установить декларацию для react-dom:

tsd install react-dom --save

3. Добавить ссылку на декларацию react-dom в исходные тексты:

/// <reference path="../typings/react/react-dom.d.ts" />

4. Импортировать модуль react-dom:

import * as ReactDOM from 'react-dom';