최근에 Expo와 함께 TypeScript를 사용하기 시작했습니다. typescript-eslint코딩하는 동안 대부분의 오류를 잡을 수 있도록 모든 linter / formatter 통합을 수행했습니다 . 코드가 컴파일되는지 확인하기 위해 가끔씩 실행 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를 처음 접했기 때문에 매우 중요한 내용이 누락되었을 수 있습니다. 이 절제를 일으키는 원인은 무엇이며보다 엄격한 검사를 수행 할 수있는 방법이 있습니까?
답변
가장 먼저 이해해야 할 것은 Typescript는 Javascript의 상위 집합이며,이 경우 실제로 컴파일하는 동안 형식 검사를받지 않습니다.
기본적으로 Babel은 Typescript를 제거하고 Javascript로 변환 한 다음 js 번들로 컴파일합니다.
https://babeljs.io/docs/en/next/babel-plugin-transform-typescript 와 같은 Babel 문서의 첫 번째 줄을 살펴볼 수 있습니다.
Babel은 형식 검사가 아니기 때문에 구문 상 올바른 코드이지만 TypeScript 형식 검사에 실패한 코드는 성공적으로 변환 될 수 있으며 종종 예기치 않은 또는 잘못된 방식으로 변환 될 수 있습니다.
내가 제안하는 것은 tsconfig에서 true tsc로 noEmit설정하고 먼저 Typescript 컴파일을 포함 하거나 오히려 컴파일 하도록 빌드 명령을 확장하는 것 입니다.
업데이트 : 프로젝트를 추가 jest하거나 typescript프로젝트에 추가 할 때 최근에 적용되는 다른 인스턴스를 발견 했습니다. Jest 문서의 맨 아래에 실제로 동일한 내용이 있습니다.
https://jestjs.io/docs/en/getting-started#using-typescript
그러나 Babel과 함께 TypeScript를 사용하는 경우 몇 가지주의 사항이 있습니다. Babel의 TypeScript 지원은 코드 변환이므로 Jest는 테스트가 실행될 때 형식을 확인하지 않습니다. 원하는 경우 ts-jest를 사용할 수 있습니다.
