본문 바로가기
Typescript

230801 typescript tsconfig.json 옵션 설정

by hyerin1201 2023. 8. 1.

옵션설정하기 위해 터미널에

==> tsc --init : 컴파일링 옵션을 볼 수 있도록 하는 명령어  -> tsconfig.json 파일 생김.

*compilerOptions: 

      *target : 컴파일링한 자바스크립트 버전 정의 (ESNext : 가장 최신 버전 /  ES5 : 화살표함수 없음 )

      *module: 컴파일링한 자바스크립트의 모듈 타입 정의 ( CommonJS / ESNext (자바스크립트 공식 표준))

----------CommonJs : require( ) / module.exports;

----------ESNext :  import( ) / export default 

      *outdir : 컴파일링된 자바스크립트의 파일을 저장하는 경로 설정 (파일이름입력)

      *strict : 엄격하게 타입을 정의할지 정의 (true / false)

 

      기본적으로 자바스크립트는 각각의 파일을 개별 모듈 취급

      타입스크립트는 각각의 파일을 전역 모듈로 취급(변수의 중복 선언 불가)

      동일한 변수의 이름을 독립적인 변수로 사용하기 위해선 -> 독립모듈로 사용하게끔 해야한다. 

      *moduleDetection: "force"

 

     *ESM 에서만 가져올수 있는 모듈이 있음

     -> CJS 로 작성한 모듈을 ESM 모듈로 연동시킬수 있음 

     *esModuleInterop: true 설정.

 

     *리액트를 활용해서 작업한 결과물 -> 타입스크립트 변환시 상태관리 hooks 중 redux *외부라이브러리 설치한 경우는         타입스크립트에서 값을 찾아오지 못함.

     *moduleResolution: "Node"  설정

 

     *절대경로 형식으로 모듈 파일경로를 가져오고 싶을때

     *baseUrl: " . " :해당프로젝트의 최상위 루트폴더를 기준으로 잡아줌

     

     * 특정경로안에 있는 모든 파일을 가져올때 (baseUrl 과 함께 많이 씀)

     *paths: { " * "  : [ "파일이름/*" ] }

 

     *컴파일링시 --.js.map 파일이 생김 : 버그 발생시 map 파일을 보면서 문제점 확인 가능...(많이 안쓴다고함)

     *sourceMap : true 

 

     *for문(반복문) 에서 발생하는 error (Iteration오류) 를 잡아준다.

     *downlevelIteration: true

 

     *아직 타입이 정해져있지 않은 매개변수의 타입오류

     *noImplicitAny: false

 

     * 타입스크립트 프로젝트 안에 자바스크립트로 만들어놓은 모듈 및 소스코드 사용가능

     *allowJs : true

 

     * 객체의 타입을 정의하기위해 만든 클래스, 그 클래스의 타입마저 정의를 해야함. : 오류로잡지 않고싶을때

     *strictPropertyInitialization: false

"strictNullChecks": false
"allowSyntheticDefaultImports": true

 

*include : 타입스크립트의 파일이 어디있는지 정의 (독립옵션)

*ts-node: { esm: "true" } : ESNext 최신버전일때는 tsc-node 실행이 안됨, -> package.json 에서 type: "module" 설정 후 -> tsconfig.json 에서 ts-node값을 설정. (독립옵션)