TSX (TypeScript с JSX)
TSX — расширение файла для TypeScript-файлов, содержащих синтаксис JSX. Оно объединяет систему типов TypeScript с шаблонным синтаксисом React JSX, обеспечивая типобезопасную разработку компонентов.
MIME-тип
text/tsx
Тип
Текст
Сжатие
Без потерь
Преимущества
- + Type-safe React components with prop validation at compile time
- + Excellent IDE autocomplete for props and event handlers
- + Catches common React bugs before runtime
Недостатки
- − Requires TypeScript compiler configuration
- − Generic component syntax can conflict with JSX angle brackets
- − More boilerplate than plain JSX for simple components
Когда использовать .TSX
Используйте .tsx для React-компонентов в TypeScript-проектах. Стандартная практика — использовать .tsx для файлов с JSX и .ts для файлов без него.
Технические детали
Файлы TSX обрабатываются компилятором TypeScript с параметром jsx в tsconfig.json (react, react-jsx, react-jsxdev или preserve). TypeScript обеспечивает проверку типов для пропсов через React.FC
История
TypeScript добавил поддержку JSX начиная с версии 1.6 (2015), что позволило использовать типизацию для React-компонентов. Расширение .tsx быстро стало стандартом для React-проектов на TypeScript.