Is there any downside to using .tsx instead of .ts all the times in typescript?

Question

I just start working on a React project with TypeScript and ask myself what should I do with regular class files? Should I use .ts or .tsx files an

Answer 1

It's kind of a convention to use x in the end when your JavaScript is in JSX Harmony mode. That is, when this is valid:

doSomething(
My div
);

However, your file extension doesn't really matter, as long as your pre-processors are aware of your decision (browserify or webpack). I, for one, use .js for all my JavaScript, even when they are React. The same applies for TypeScript, ts/tsx.

EDIT

Now, I would strongly recommend using JSX for Javascript with React syntax and TSX for TypeScript with React because most editors/IDEs will use the extension to enable or not the React syntax. It is also consider it to be more expressive.