PropTypes en una aplicación TypeScript React

¿Tiene React.PropTypessentido usarlo en una aplicación React de TypeScript o es solo un caso de "cinturón y tirantes"?

Dado que la clase de componente se declara con un Propsparámetro de tipo:

interface Props {
    // ...
}
export class MyComponent extends React.Component<Props, any> { ... }

¿Existe algún beneficio real al agregar

static propTypes {
    myProp: React.PropTypes.string
}

a la definición de clase?

Por lo general, no hay mucho valor en mantener los accesorios de sus componentes como tipos de TypeScript y React.PropTypesal mismo tiempo.

A continuación, se muestran algunos casos en los que resulta útil hacerlo:

• Publicar un paquete, como una biblioteca de componentes, que será utilizado por JavaScript simple.
• Aceptar y transmitir información externa, como los resultados de una llamada a la API.
• Usar datos de una biblioteca que pueden no tener mecanografiados adecuados o precisos, si los hay.

Entonces, generalmente es una cuestión de cuánto puede confiar en su validación de tiempo de compilación.

Las versiones más recientes de TypeScript ahora pueden inferir tipos en función de su React.PropTypes( PropTypes.InferProps), pero los tipos resultantes pueden ser difíciles de usar o hacer referencia a otros en su código.

Mecanografiado y PropTypes tienen diferentes propósitos. TypeScript valida los tipos en tiempo de compilación , mientras que los PropTypes se comprueban en tiempo de ejecución .

TypeScript es útil cuando está escribiendo código: le advertirá si pasa un argumento del tipo incorrecto a sus componentes de React, le dará autocompletado para llamadas a funciones, etc.

Los PropTypes son útiles cuando prueba cómo los componentes interactúan con datos externos, por ejemplo, cuando carga JSON desde una API. PropTypes lo ayudará a depurar (cuando esté en el modo de desarrollo de React) por qué su componente falla imprimiendo mensajes útiles como:

Warning: Failed prop type: Invalid prop `id` of type `number` supplied to `Table`, expected `string`

Aunque parezca que TypeScript y PropTypes hacen lo mismo, en realidad no se superponen en absoluto. Pero es posible generar PropTypes automáticamente desde Typecript para que no tenga que especificar tipos dos veces, vea por ejemplo:

• https://github.com/milesj/babel-plugin-typescript-to-proptypes
• https://github.com/grncdr/ts-react-loader#what-it-does
• https://github.com/gcanti/prop-types-ts

Supongo que en algunas situaciones complicadas en las que el tipo de accesorios no se puede inferir en tiempo de compilación, sería útil ver las advertencias generadas por el uso propTypesen tiempo de ejecución.

Una de esas situaciones sería cuando se procesan datos de una fuente externa para la que las definiciones de tipo no están disponibles, como una API externa fuera de su control. Para las API internas, creo que vale la pena el esfuerzo de escribir (o mejor, generar) definiciones de tipo, si aún no están disponibles.

Aparte de eso, realmente no veo ningún beneficio (por lo que nunca lo he usado personalmente).