일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
- next.js
- 백준
- typescript
- 프론트엔드
- BFS
- Study
- 리액트
- 아키텍처
- Solid
- test
- 타입스크립트
- DAILY
- error
- react
- 다이나믹프로그래밍
- jest
- 타입
- type
- 알고리즘
- nextjs
- Unit Test
- 자바스크립트
- Component
- Docker
- javascript
- docker-compose
- SVG
- svgr
- Primitive
- DFS
- Today
- Total
`프론트엔드 개발자` 개형이의 벽돌집
타입스크립트 (5) - tsconfig란? what is tsconfig in TypeScript? 본문
타입스크립트에서 tsconfig.json 은 타입스크립트를 자바스크립트로 변환활 때 설정을 정의해놓은 파일이다.
주요 속성으로는 무엇이 있는지 기록해두고자 한다.
noImplicitAny
🤔 noImplicitAny를 true로 설정할 경우 any로 추론될 수 있는 타입을 명시적으로 지정해줘야 한다.
tsconfig.json 에 아래와 같이 지정해주면 된다.
"compilerOptions": {
"noImplicitAny": true,
// ~~~
}
1) true일 때
const add = (a, b) => {
return a + b;
};
// a, b의 타입이 any로 추론되어 에러가 발생함
const add = (a: number, b: number) => {
return a + b;
};
// a, b의 타입을 명시적으로 지정해주어 에러가 발생하지 않음
2) false일 때
const add = (a, b) => {
return a + b;
};
// a, b의 타입이 any로 추론되어도 에러가 발생하지 않음
strictNullChecks
🤔 strictNullChecks를 true로 설정할 경우 모든 타입에 자동으로 포함되는 null, undefined 가 포함되지 않는다.
tsconfig.json 에 아래와 같이 지정해주면 된다.
"compilerOptions": {
"strictNullChecks": true,
// ~~~
}
1) true일 때
const a: null = null;
const b: string = a; // 에러 발생
// null과 undefined 타입을 다른 타입의 값에 할당할 수 없게 함
2) false일 때
const a: null = null;
const b: string = a; // 에러가 발생하지 않음
noImplicitReturns
🤔 noImplicitReturns를 true로 설정할 경우 함수 내에서 모든 코드가 값을 리턴하지 않으면 컴파일 에러가 발생한다.
tsconfig.json 에 아래와 같이 지정해주면 된다.
"compilerOptions": {
"noImplicitReturns": true,
// ~~~
}
1) true일 때
function temp (x: number) : number | undefined {
if (x > 0) {
return x;
}
}
// 모든 조건에 대해 리턴하지 않으므로 컴파일시 에러 발생
function temp (x: number) : number | undefined {
if (x > 0) {
return x;
} else {
return -1;
}
}
// 에러가 발생하지 않음
2) false일 때
function temp (x: number) : number | undefined {
if (x > 0) {
return x;
}
}
// 에러 발생하지 않음
strict
🤔 strict를 true로 설정할 경우 다양한 타입 검사를 가능하게 하여 프로그램 정확성을 더욱 보장할 수 있다고 한다. strict가 true일 경우에 다음 옵션들을 활성화한다. 자세한 사항은 링크를 걸어두었으니 공식 타입스크립트 문서를 통해 확인할 수 있다.
- alwaysStrict
- strictNullChecks
- strictBindCallApply
- strictFunctionTypes
- strictPropertyInitialization
- noImplicitAny
- noImplicitThis
- useUnknownInCatchVariables
tsconfig.json 에 아래와 같이 지정해주면 된다.
"compilerOptions": {
"strict": true,
// ~~~
}
이번 포스팅에는 tsconfig에 속성에 무엇이 있는지 확인하였다.
전부 false로 설정해주면 컴파일 에러가 발생하지 않아 IDE에서 빨간줄을 안보며 코딩할 수 있긴 하지만
그러면 타입스크립트를 사용하는 의미가 없으니 속성을 적절히 활용하여 타입스크립트의 장점을 가져가면 좋을 듯 하다 ..!
'타입스크립트' 카테고리의 다른 글
타입스크립트 (4) - 타입 가드란? what is Type Guard in TypeScript? (0) | 2022.05.24 |
---|---|
타입스크립트 (3) - 타입의 추론. 타입은 어떻게 추론될까? (0) | 2022.05.13 |
타입스크립트 (2) - 타입의 사용. 어떻게 사용할 수 있을까? (0) | 2022.05.11 |
타입스크립트 (1) - 타입스크립트를 왜 사용하는가? why typescript? (0) | 2022.01.12 |