tsconfig.json 설정

target 으로 컴파일 후 js문법 버전을 설정할 수 있다.

"target": "es6"

documet 나 console 를 사용할 수 있는 이유

const button = document.querySelector('button')!;

button.addEventListener('click', (e) => {
   console.log('clicked!');
});

lib 설정을 안하면 기본 설정을 해주기 때문이다.

"lib": ["DOM", "ES6", "DOM.Iterable", "ScriptHost"]

"allowJs": true

ts가 js 파일을 컴파일할 수 있도록 해준다.

"checkJs": true

ts가 컴파일을 수행하지 않더라도 구문을 검사하고 에러를 보고해준다.
ts를 사용하지 않고 일부 기능의 장점을 취하고자 할 때 사용한다.
ts는 js에서 효과적으로 사용할 수 있는 any 타입만 허용할 수 있다.

"sourceMap": true

true로 설정 후 컴파일하면 app.js.map 파일이 생성된다.
이 파일은 js 파일과 ts 파일 간의 디버거를 이어주는 역할을 한다.
크롬 개발자 도구 sources 탭에서 ts 파일을 볼 수 있다.

"outDir": "./dist"

ts 파일 컴파일 후 js 파일을 저장할 위치를 설정한다.

"rootDir": "./src"

컴파일할 ts 파일을 찾을 위치를 설정한다.

"removecomments": true

ts 파일의 주석이 컴파일된 js 파일에서 제거된다.
파일 크기를 줄이는 데 좋은 옵션이다.

"noEmit": true

js 파일을 생성하지 않으려면 true로 설정한다.
파일이 정확한지 확인하고 싶고 시간을 절약하기 위해
모든 출력 파일을 만들고 싶지 않을 때 사용한다.
파일 안만들고 컴파일 오류 찾음

"downlevelIteration": true

루프가 있고 컴파일된 코드에서 그 루프가 다르게 동작할 때 사용해서
코드를 이전 버전 js로 컴파일 후 정상적으로 동작시킨다.

"noEmitOnError": false

컴파일에서 에러가 발생해도 js 파일을 만든다.
false가 기본값이고 true로 하면 에러가 발생했을 때 js 파일을 생성하지 않는다.

"strict": true

noImplicitAny, strictNullChecks, strictFunctionTypes, strictBindCallApply, strictPropertyInitialization, noImplicitThis, alwaysStrict
위 설정들을 모두 true나 false로 결정한다.

"noImplicitAny": true

암묵적으로 any 타입을 허락하지 않는다.

"strictNullChecks": true

null인지를 체크

"noUnusedLocals": true

함수 안 지역변수를 쓰고 사용하지 않았을 때 컴파일 에러를 낸다.
전역변수를 사용하면 ts는 사용할 줄 모르기 때문에 에러는 나지 않는다.

"noUnusedParameters": true

사용하지 않는 파라미터가 있을 때 에러를 낸다.

"noImplicitReturns": true

때로는 반환을 하고 때로는 반환을 하지 않는 함수가 있을 때 에러는 낸다.