TSX (TypeScript XML — React)
TSX es la combinación de TypeScript con JSX, permitiendo componentes React con verificación de tipos. Proporciona seguridad de tipos para props, estado y estructura JSX, detectando errores de UI durante el desarrollo.
Tipo MIME
text/tsx
Tipo
Texto
Compresión
Sin pérdida
Ventajas
- + Type-safe React components with prop validation at compile time
- + Excellent IDE autocomplete for props and event handlers
- + Catches common React bugs before runtime
Desventajas
- − Requires TypeScript compiler configuration
- − Generic component syntax can conflict with JSX angle brackets
- − More boilerplate than plain JSX for simple components
Cuándo usar .TSX
Usa TSX al construir aplicaciones React con TypeScript. Es estándar en proyectos React profesionales donde la seguridad de tipos es importante.
Detalles técnicos
Los archivos TSX requieren la configuración "jsx" del compilador de TypeScript (react, react-jsx o preserve). TypeScript verifica la estructura JSX contra tipos de elementos intrínsecos y definiciones de props de componentes personalizados, proporcionando autocompletado y detección de errores.
Historia
El soporte TSX llegó con la integración de TypeScript con JSX de React. A medida que TypeScript ganó adopción en 2016-2018, TSX se convirtió en la forma preferida de escribir componentes React en proyectos profesionales.