tsconfig.json 설정 오류 해결: allowImportingTsExtensions는 왜 에러가 날까?

📌 에러 원인:

allowImportingTsExtensions 옵션은 TypeScript가 .ts 또는 .tsx 확장자를 명시적으로 import하는 것을 허용하는 기능입니다.

 

import { something } from './utils.ts';

 

이런 식의 import를 허용하려면 TypeScript가 실제로 JavaScript 파일을 emit하지 않는 설정이어야 합니다. 그렇지 않으면 문제가 발생할 수 있기 때문이에요.

그래서 이 옵션을 사용하려면 아래 중 하나를 설정해야 합니다:

• "noEmit": true
  👉 TypeScript가 아무 파일도 출력하지 않음
• "emitDeclarationOnly": true
  👉 타입 정의 파일(.d.ts)만 출력함

---

✅ 해결 방법:

방법 1. noEmit 설정 추가하기 (가장 일반적)

{
  "compilerOptions": {
    "allowImportingTsExtensions": true,
    "noEmit": true
  }
}

 

방법 2. emitDeclarationOnly 설정 추가

{
  "compilerOptions": {
    "allowImportingTsExtensions": true,
    "emitDeclarationOnly": true
  }
}

 

---

❓ 왜 이렇게 제한할까?

.ts 확장자를 포함한 import는 Node.js ESM 환경에서 주로 사용되며, TypeScript가 이를 처리할 때 .js로 변환하는 과정에서 충돌이 발생할 수 있기 때문입니다. 그래서 출력을 하지 않도록 제한한 것입니다.