¿Por qué mi aplicación React Native se compila correctamente a pesar del error del compilador TypeScript?

15

Recientemente comencé a usar TypeScript con Expo. He hecho todas las integraciones de linter / formateador typescript-eslintpara poder detectar la mayoría de los errores durante la codificación. Para verificar si el código se compila, ejecuto de npx tscvez en cuando y lo arreglo en consecuencia.

Una cosa que aún no he entendido completamente es por qué mi aplicación se compila correctamente incluso cuando hay numerosos errores de compilación. Espero (y prefiero) ver un error de pantalla roja para cada error de compilación en lugar de que la aplicación se compile correctamente y lo descubro más tarde. Por ejemplo,

function square<T>(x: T): T {
  console.log(x.length); // error TS2339: Property 'length' does not exist on type 'T'.
  return x * x;
}

es un error típico de TypeScript que (¿creo?) se puede verificar fácilmente en tiempo de compilación. Quiero que resulte en un gran error de pantalla roja y que la compilación falle.

Soy bastante nuevo en TypeScript, por lo que es posible que me falte algo muy importante. ¿Qué es exactamente lo que está causando esta indulgencia? ¿Hay alguna forma de aplicar controles más estrictos?

reactjs typescript react-native expo anar
fuente
Por "compilaciones exitosas", ¿quiere decir que el JS se emite de todos modos, o no se muestra ningún mensaje de error del compilador en algún momento?
ecraig12345
2
Quiero decir que el JS se emite de todos modos y puedo ejecutar la aplicación en modo de desarrollo e incluso puedo construir la aplicación de producción sin ningún problema. Hubiera esperado que TypeScript evitara esto en tiempo de compilación. Los mensajes de error del compilador siempre se muestran cuando ejecuto, npx tscpero quiero obtener una pantalla roja para cada error de TypeScript, al igual que lo hago para los errores normales de JS como const n = 23; n.reverse();ese da como resultado una pantalla roja con el mensaje "n.reverse no es una función". 'n.reverse ()', 'n.reverse' no está definido) "
anar
2
Esto también me parece extraño. Tampoco puedo encontrar una solución adecuada.
Simon Bengtsson

Respuestas:

2

Lo primero que hay que entender es que Typescript es un superconjunto de Javascript, y en este caso no se verifica el tipo durante la compilación.

Esencialmente, lo que sucede es que Babel simplemente elimina el mecanografiado y lo convierte a Javascript, que luego se compila en los paquetes js.

Puede echar un vistazo a la primera línea de los siguientes documentos de Babel, así como a las advertencias: https://babeljs.io/docs/en/next/babel-plugin-transform-typescript

Dado que Babel no realiza la verificación de tipo, el código que es sintácticamente correcto, pero que fallaría, la verificación de tipo de TypeScript puede transformarse con éxito y, a menudo, de manera inesperada o inválida.

Lo que sugeriría es extender su comando de compilación para incluir primero, tsco más bien, la compilación de Typecript, con noEmitset to true en su tsconfig.

Actualización : Encontré otra instancia donde esto se aplica recientemente al agregar jesty typescripta un proyecto. En la parte inferior de los documentos de Jest, en realidad dicen lo mismo:

https://jestjs.io/docs/en/getting-started#using-typescript

Sin embargo, hay algunas advertencias sobre el uso de TypeScript con Babel. Debido a que el soporte de TypeScript en Babel es transpilación, Jest no verificará sus pruebas mientras se ejecutan. Si quieres eso, puedes usar ts-jest.

Mark Atkinson
fuente