Mengapa aplikasi React Native saya berhasil dibangun meskipun ada kesalahan kompiler TypeScript?

15

Saya baru-baru ini mulai menggunakan TypeScript dengan Expo. Saya telah melakukan semua integrasi linter / formatter seperti typescript-eslintagar saya dapat menangkap sebagian besar kesalahan selama pengkodean. Untuk memeriksa apakah kode dikompilasi, saya jalankannpx tsc sesekali dan memperbaikinya.

Satu hal yang belum sepenuhnya saya pahami adalah mengapa aplikasi saya berhasil dibangun walaupun ada banyak kesalahan kompilasi. Saya berharap (dan lebih suka) melihat kesalahan layar merah untuk setiap kesalahan kompilasi daripada membangun aplikasi dengan sukses dan saya mengetahuinya nanti. Sebagai contoh,

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

adalah kesalahan TypeScript khas yang (saya percaya?) dapat dengan mudah diperiksa pada waktu kompilasi. Saya ingin ini menghasilkan kesalahan layar merah besar dan build gagal.

Saya cukup baru untuk TypeScript sehingga mungkin saya kehilangan sesuatu yang sangat penting. Apa sebenarnya yang menyebabkan keringanan hukuman ini dan apakah ada cara untuk menegakkan pemeriksaan yang lebih ketat?

reactjs typescript react-native expo anar
sumber
By "builds berhasil" maksud Anda JS adalah output tetap, atau tidak ada pesan kesalahan kompilator ditampilkan di beberapa titik?
ecraig12345
2
Maksud saya JS adalah output tetap dan saya dapat menjalankan aplikasi dalam mode dev dan bahkan dapat membangun aplikasi produksi tanpa masalah. Saya akan mengharapkan TypeScript untuk mencegah hal ini pada waktu kompilasi. Pesan kesalahan kompiler selalu ditampilkan ketika saya menjalankan npx tsctetapi saya ingin mendapatkan layar merah untuk setiap kesalahan TypeScript seperti yang saya lakukan untuk kesalahan JS normal seperti const n = 23; n.reverse();yang menghasilkan layar merah dengan pesan "n.reverse bukan fungsi. (Dalam 'n.reverse ()', 'n.reverse' tidak terdefinisi) "
anar
2
Saya menemukan ini sangat aneh juga. Saya juga tidak dapat menemukan solusi yang memadai.
Simon Bengtsson

Jawaban:

2

Hal pertama yang harus dipahami adalah bahwa TypeScript adalah superset dari Javascript, dan dalam hal ini sebenarnya tidak diperiksa jenisnya selama kompilasi.

Pada dasarnya apa yang terjadi adalah Babel menghapus Stripteks dan mengubahnya menjadi Javascript, yang kemudian dikompilasi ke dalam bundel js.

Anda dapat melihat pada baris pertama dari dokumen Babel berikut ini serta peringatan: https://babeljs.io/docs/en/next/babel-plugin-transform-typescript

Karena Babel tidak mengetik-cek, kode yang secara sintaksis benar, tetapi akan gagal pengecekan tipe-Script mungkin berhasil ditransformasikan, dan seringkali dengan cara yang tidak terduga atau tidak valid.

Apa yang saya sarankan adalah memperluas perintah build Anda untuk pertama kali memasukkan tscatau lebih tepatnya kompilasi naskah, dengan noEmitset ke true di tsconfig Anda.

Pembaruan : Saya menemukan contoh lain di mana ini berlaku baru-baru ini ketika menambahkan jestdan typescriptke proyek. Di bagian bawah dokumen Jest mereka benar-benar menyatakan hal yang sama:

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

Namun, ada beberapa peringatan untuk menggunakan TypeScript dengan Babel. Karena dukungan TypeScript di Babel adalah transpilasi, Jest tidak akan mengetik-periksa tes Anda saat dijalankan. Jika Anda menginginkannya, Anda dapat menggunakan ts-jest.

Mark Atkinson
sumber