Dlaczego moja aplikacja React Native buduje się pomyślnie pomimo błędu kompilatora TypeScript?

15

Ostatnio zacząłem używać TypeScript z Expo. Zrobiłem wszystkie integracje linijki / formatyzatora tak, typescript-eslintaby móc wychwycić większość błędów podczas kodowania. Aby sprawdzić, czy kod się kompiluje, uruchamiamnpx tsc co jakiś czas i odpowiednio naprawiam.

Jedną z rzeczy, których jeszcze nie w pełni zrozumiałem, jest to, dlaczego moja aplikacja buduje się pomyślnie, nawet jeśli występuje wiele błędów kompilacji. Spodziewam się (i wolę), aby zobaczył błąd czerwonego ekranu dla każdego błędu kompilacji zamiast pomyślnej kompilacji aplikacji i dowiem się go później. Na przykład,

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

jest typowym błędem TypeScript, który (jak sądzę?) można łatwo sprawdzić podczas kompilacji. Chcę, aby spowodowało to duży błąd czerwonego ekranu i niepowodzenie kompilacji.

Jestem całkiem nowy w TypeScript, więc możliwe, że brakuje mi czegoś bardzo ważnego. Co dokładnie powoduje tę łagodność i czy istnieje sposób egzekwowania surowszych kontroli?

reactjs typescript react-native expo anar
źródło
Pod pojęciem „kompilacja zakończyła się powodzeniem” czy masz na myśli, że JS jest generowany, czy w którymś momencie nie pojawia się komunikat o błędzie kompilatora?
ecraig12345,
2
Mam na myśli, że JS jest generowany i mogę uruchomić aplikację w trybie deweloperskim, a nawet zbudować aplikację produkcyjną bez żadnych problemów. Oczekiwałem, że TypeScript zapobiegnie temu podczas kompilacji. Komunikaty o błędach kompilatora są zawsze wyświetlane po uruchomieniu, npx tscale chcę uzyskać czerwony ekran dla każdego błędu TypeScript, tak jak robię to w przypadku zwykłych błędów JS, takich jak const n = 23; n.reverse();ten, co powoduje, że czerwony ekran z komunikatem „n.reverse nie jest funkcją.” „n.reverse ()”, „n.reverse” jest niezdefiniowany) ”
anar
2
Uważam to również za dziwne. Nie mogę też znaleźć odpowiedniego rozwiązania.
Simon Bengtsson,

Odpowiedzi:

2

Pierwszą rzeczą do zrozumienia jest to, że Typescript jest nadzbiorem Javascript i w tym przypadku nie jest sprawdzany podczas kompilacji.

Zasadniczo to, co się dzieje, polega na tym, że Babel po prostu usuwa Typescript i konwertuje go na JavaScript, który następnie jest kompilowany w pakiety js.

Możesz rzucić okiem na pierwszą linię następujących dokumentów Babel, a także na zastrzeżenia: https://babeljs.io/docs/en/next/babel-plugin-transform-typescript

Ponieważ Babel nie sprawdza typu, kod, który jest poprawny pod względem składniowym, ale zawiedzie, sprawdzanie typu TypeScript może z powodzeniem zostać przekształcone i często w nieoczekiwany lub nieprawidłowy sposób.

Sugeruję, aby rozszerzyć polecenie kompilacji o najpierw tsckompilację maszynopisu, a raczej o niąnoEmit maszynopisu, ustawiło na true w tsconfig.

Aktualizacja : Znalazłem inny przypadek, w którym ostatnio dotyczy to dodawania jestitypescript do projektu. Na dole dokumentów Jest jest faktycznie to samo:

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

Istnieją jednak pewne zastrzeżenia dotyczące używania TypeScript z Babel. Ponieważ obsługa TypeScript w Babel to transpilacja, Jest nie sprawdza typów testów podczas ich uruchamiania. Jeśli chcesz, możesz użyć ts-jest.

Mark Atkinson
źródło