Typescript 컴파일러 명령어 및 사용법

최석훈·2022년 4월 16일
0
post-custom-banner

프로젝트 구조화를 위한 명령어 모음

  • tsconfig.json을 생성해준다. 그래서 tsconfig.json에서 내가 원하는 방식으로 ts 파일을 컴파일 커스텀을 할 수 있다.
tsc --init 

  • tsconfig.json이 위치한 모든 ts 파일을 컴파일해서 js파일로 만들어준다.
tsc -w

  • 컴파일된 js 파일들이 ts파일과 같이 있으면 헷갈리기 때문에 tsconfig.json에 outDir에서 js를 모아놓을 경로를 지정할 수 있다.
-tsconfig.json

"outDir":"./build"

  • src라는 파일 안에 모든 ts 파일을 넣는 것을 규칙으로 하고 싶다면 tsconfig.json에 rootDir를 설정해주면 된다.
-tsconfig.json
"rootDir":"./src",

이런 설정이 필요한 이유는 파일 안에 경로로가 꼬일 수 있기 때문이다. 예를 들어서 html파일에 js파일의 위치를 "./build/example.js"라고 해놨는데 src에만 ts파일이 존재하는 경우 tsc 명령어로 컴파일을 할 경우 위에서 build 디렉토리에 js파일을 만드는 것으로 약속해놨지때문에 경로가 제대로 나온다.
하지만 src밖에 ts를 만들게 되는 경우 exmaple.js의 경로가 "./build/src/example.js"로 바뀌게 된다. 그러면 경로 오류가 발생할 것이다. 그것을 막기 위해서 rootDir에 ts 파일들의 위치를 정해줘서 src 밖에서 ts파일이 생성된는 것을 막아줘야한다.


  • 원하는 파일만 컴파일하기. 원하는 파일만 컴파일 하지 않기
-tsconfig.json

"include": ["./src/example.ts"], // example.ts만 컴파일 하기.

"exclude": ["./src/example.ts"], // example.ts만 컴파일 하지 않기.

profile
하루를 열심히
post-custom-banner

0개의 댓글