TypeScript and React JSX

Hi,

I'm trying to configure TypeScript with React JSX and so far I created valid compilation configuration, but I have problem with syntax highlighting. When I write my file I use TypeScript syntax so I give file extension *.ts. Thanks to this TypeScript specific parts of code are interpreted correctly, but in this class I have also React JSX which gets highlighted and treated as inccorrect syntax by Intellij. If I change file extension to *.jsx, than JSX is ok (although I doesn't get autocompletion) but my TypeScript syntax gets highlighted.
How can I configure IntelliJ or WebStorm to treat such file correctly?

I attached screenshots of both cases, "typescript.png" shows file with "*.ts" extension and "jsx.png" shows file with "*.jsx" extension.



Attachment(s):
jsx.png
typescript.png
0
3 comments

There is no way to configure this currently. Please vote for https://youtrack.jetbrains.com/issue/WEB-14441

0
Avatar
Permanently deleted user

I solved it by adding *.jsx in File Types (see the screenshot). The icon is wrong for .jsx files though, which is a bit annoying. Please, let me know if someone has a better solution :) 

0

Support for JSX in Typescript is available since Webstorm 11, no additional configuration is required in the recent versions

0

Please sign in to leave a comment.