gincheong / Memo

개발 관련 내용들을 메모하기 위한 용도로 만든 빈 레포지토리입니다.
0 stars 0 forks source link

Typescript 컴파일 시에 alias 적용하기 #42

Open gincheong opened 3 years ago

gincheong commented 3 years ago

그냥 tsc-alias 쓰면 됨


tsc 명령어로 ts파일을 js로 컴파일할 수 있다.

컴파일할 때 tsconfig에 declaration: true 하는 것으로 Typescript를 위한 타입 추론을 돕는 d.ts 파일을 생성시킬 수 있다.

그런데 이 d.ts파일은 tsc 명령어로 컴파일되고 나서 tsconfig.json에 적용한 alias를 정상적으로 상대경로로 변경해주지 않고, alias를 그대로 사용하여 컴파일한다.

보통 tsc로 타입스크립트 컴파일 -> babel로 컴파일 하면서 alias를 적용해 준다고 하는데

여기서 js파일은 babel이 alias를 변환해 주지만, d.ts 파일은 Typescript 파일이기 때문에 babel에서 관여를 안 한다

그래서 Typescript 컴파일 할 때 d.ts에 alias를 상대경로로 바꿔주는 작업이 필요하다.

gincheong commented 3 years ago
npm install --save-dev ttypescript
npm install --save-dev typescript-trasnform-paths

이걸 설치하고 난 뒤에, tsconfig.json에 다음 내용을 추가한다.

{
  "compilerOptions": {
    "plugins": [
      {
        "transform": "typescript-transform-paths",
        "afterDeclarations": true
      }
    ],
    ...
  }
}

그 다음, Typescript 컴파일 명령어를 tsc 대신 ttsc 로 사용하면, alias가 상대경로로 변환된 상태로 컴파일된다.