[나의 오류 일지] Typescript emitted no output

Webpack으로 React 개발 환경을 구축하고 타입스크립트를 설정하는 과정에서 다음과 같은 에러가 발생했다.

Typescript emitted no output

 

도무지 무슨 에러인지 감도 안 잡혔는데, 관련된 깃허브 이슈를 보고 실마리를 얻을 수 있었다.

 

https://github.com/TypeStrong/ts-loader/issues/1602

ts-loader doesn't work when ts-config noEmit is set to true · Issue #1602 · TypeStrong/ts-loader

https://github.com/TypeStrong/ts-loader/issues/1602

ts-loader doesn't work when ts-config noEmit is set to true · Issue #1602 · TypeStrong/ts-loader

---

 

트랜스파일링을 위한 로더로 ts-loader를 사용하고 있다. 그 후 타입스크립트의 noEmit 옵션을 true로 설정했는데, 해당 부분에서 에러가 발생한 모양이다.

 

타입스크립트의 noEmit 옵션을 사용하면 컴파일러가 결과물을 생성하지 않게 된다. 따라서 Babel이나 SWC와 같은 다른 도구가 타입스크립트 파일을 변환할 수 있게 한다.

 

즉, 간단하게 말하자면 타입스크립트가 빌드 전 단순히 타입을 체크하는 일만 맡게 된다.

 

그러나 ts-loader를 사용하면서 noEmit 옵션을 설정하게 되면 트랜스파일된 결과물이 없기 때문에 Webpack에 전달되는 파일이 없어지게 된다. 

noEmit: false // default value

 

 

따라서, ts-loader를 사용한다면 타입스크립트의 noEmit 옵션을 제거해야 한다.

---

 

아마 babel-loader나 esbuild-loader를 사용하는 경우에는 위와 같은 에러가 발생하지 않을 것 같은데, 성능 면에서도 그렇고 추후 esbuild-loader로 변경하는 것을 고려하고 있다 😓