`프론트엔드 개발자` 개형이의 벽돌집

타입스크립트 (5) - tsconfig란? what is tsconfig in TypeScript? 본문

타입스크립트

타입스크립트 (5) - tsconfig란? what is tsconfig in TypeScript?

개형이 2022. 6. 14. 23:17

타입스크립트에서 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일 경우에 다음 옵션들을 활성화한다. 자세한 사항은 링크를 걸어두었으니 공식 타입스크립트 문서를 통해 확인할 수 있다.

 

 

tsconfig.json 에 아래와 같이 지정해주면 된다.

"compilerOptions": {
    "strict": true,
    // ~~~
}

 

 


 

 

이번 포스팅에는 tsconfig에 속성에 무엇이 있는지 확인하였다.

전부 false로 설정해주면 컴파일 에러가 발생하지 않아 IDE에서 빨간줄을 안보며 코딩할 수 있긴 하지만

그러면 타입스크립트를 사용하는 의미가 없으니 속성을 적절히 활용하여 타입스크립트의 장점을 가져가면 좋을 듯 하다 ..!

 

Comments