เหตุใดแอป React Native ของฉันจึงสร้างได้สำเร็จแม้จะมีข้อผิดพลาดของคอมไพเลอร์ TypeScript


15

ฉันเพิ่งเริ่มใช้ TypeScript กับ Expo ฉันได้ทำการผสานรวมของ linter / formatter ทั้งหมดแล้วtypescript-eslintดังนั้นฉันจึงสามารถตรวจจับข้อผิดพลาดส่วนใหญ่ระหว่างการเขียนโค้ดได้ เพื่อตรวจสอบว่ารหัสรวบรวมฉันเรียกใช้npx tscทุกครั้งและแก้ไขตาม

สิ่งหนึ่งที่ฉันยังไม่เข้าใจก็คือสาเหตุที่แอปของฉันสร้างสำเร็จแม้ในขณะที่มีข้อผิดพลาดในการรวบรวมจำนวนมาก ฉันคาดหวัง (และชอบ) เพื่อดูข้อผิดพลาดหน้าจอสีแดงสำหรับทุกข้อผิดพลาดในการรวบรวมมากกว่าการสร้างแอปสำเร็จและฉันพบมันในภายหลัง ตัวอย่างเช่น,

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

เป็นข้อผิดพลาด TypeScript ทั่วไปที่ (ฉันเชื่อ?) สามารถตรวจสอบได้อย่างง่ายดายในเวลารวบรวม ฉันต้องการให้มันเกิดข้อผิดพลาดของหน้าจอสีแดงขนาดใหญ่และการสร้างล้มเหลว

ฉันค่อนข้างใหม่กับ TypeScript ดังนั้นจึงเป็นไปได้ว่าฉันขาดอะไรที่สำคัญมากไป อะไรเป็นสาเหตุของความผ่อนปรนนี้และมีวิธีบังคับใช้เช็คที่เข้มงวดกว่านี้หรือไม่?


โดย "builds สำเร็จ" คุณหมายถึง JS เป็นเอาท์พุทต่อไปหรือไม่มีข้อความแสดงข้อผิดพลาดของคอมไพเลอร์ที่แสดงในบางจุด?
ecraig12345

2
ฉันหมายความว่า JS เป็นเอาท์พุตอยู่แล้วและฉันสามารถรันแอพในโหมด dev และยังสามารถสร้างแอปที่ใช้งานจริงได้โดยไม่มีปัญหาใด ๆ ฉันคาดว่าจะได้ TypeScript เพื่อป้องกันสิ่งนี้ในเวลารวบรวม ข้อความแสดงข้อผิดพลาดของคอมไพเลอร์จะแสดงเสมอเมื่อฉันเรียกใช้npx tscแต่ฉันต้องการได้รับหน้าจอสีแดงสำหรับข้อผิดพลาด TypeScript ทุกประการเช่นเดียวกับที่ฉันทำกับข้อผิดพลาด JS ปกติเช่น const n = 23; n.reverse();นั้นส่งผลให้หน้าจอสีแดงพร้อมข้อความ "n.reverse ไม่ใช่ฟังก์ชัน 'n.reverse ()', 'n.reverse' ไม่ได้ถูกกำหนดไว้) "
anar

2
ฉันพบสิ่งนี้แปลกเช่นกัน ฉันไม่สามารถหาวิธีแก้ปัญหาที่เพียงพอได้เช่นกัน
Simon Bengtsson

คำตอบ:


2

สิ่งแรกที่ต้องทำความเข้าใจก็คือ typescript คือชุดของ Javascript และในกรณีนี้มันไม่ได้รับการตรวจสอบประเภทระหว่างการรวบรวม

สิ่งที่เกิดขึ้นก็คือ Babel เพิ่งจะปลด typescript และแปลงเป็น Javascript ซึ่งจะถูกคอมไพล์เป็นชุด js

คุณสามารถดูบรรทัดแรกของเอกสาร Babel ต่อไปนี้และคำเตือน: https://babeljs.io/docs/en/next/babel-plugin-transform-typescript

เนื่องจาก Babel ไม่ได้ทำการตรวจสอบ, รหัสที่ถูกต้องทางวากยสัมพันธ์, แต่จะล้มเหลวในการตรวจสอบ TypeScript อาจประสบความสำเร็จในการแปลงและบ่อยครั้งในรูปแบบที่ไม่คาดคิดหรือไม่ถูกต้อง

สิ่งที่ฉันอยากจะแนะนำคือการขยายคำสั่งการสร้างของคุณเพื่อรวมtscหรือมากกว่าการรวบรวม typescript แรกด้วยการnoEmitตั้งค่าเป็นจริงใน tsconfig ของคุณ

อัปเดต : ฉันพบอินสแตนซ์อื่นที่ใช้เมื่อไม่นานนี้เมื่อเพิ่มjestและtypescriptโครงการ ที่ด้านล่างของเอกสาร Jest พวกเขาระบุในสิ่งเดียวกัน:

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

อย่างไรก็ตามมีคำเตือนบางอย่างที่ใช้ TypeScript กับ Babel เนื่องจากการสนับสนุน TypeScript ใน Babel เป็นการแพร่กระจาย Jest จะไม่พิมพ์การตรวจสอบการทดสอบของคุณขณะทำงาน หากคุณต้องการสิ่งนั้นคุณสามารถใช้สิ่งที่น่ารังเกียจ

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.