LoginSignup
32

More than 1 year has passed since last update.

posted at

updated at

【TypeScript】.ts拡張子と.tsx拡張子

.ts拡張子と.tsx拡張子の違い

.ts拡張子

  • 純粋なTypeScriptファイル
  • JSX要素の追加をサポートしない

.tsx拡張子

  • JSXを含むファイル
  • 型アサーションの記法として value as type<type>value の2通りあるが、後者は .tsx には書けない
    <> はJSXタグのマーカーであるため)

Reactを使うプロジェクト内のTypeScriptファイルは全て.tsxではダメなのか

結論

  • .ts.tsx は明示的に分けるべき

理由

  • 拡張子で明示的にしておくことで、「このファイルにJSXを書くべきではない」ことを表すことができるため
    (UIコンポーネントのファイルか、ロジックを書くファイルか)

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
32