TypeScript / 기본적인 특징 및 기본 설정 사항 정리

 

TypeScript의 특징

 

1. 정적 타입 언어 

 

- 실행 전(컴파일 시점)에 타입을 검사한다. JS는 런타임 에러를 나중에 알아 오류 방지를 하지 못하지만 TS는 미리 이것을 

  잡아주는 역할을 한다.

 

2. 타입 추론

 

- 명시하지 않아도 자동으로 타입을 유추한다.

- let count = 3 -> count는 자동으로 number라고 인식을 한다.

 

3. 강력한 타입 시스템

 

- interface, type, enum, union, generic 등으로 복잡한 타입도 표현이 가능하다.

 

4. 객체지향 지원

 

- class, abstract, implements 등 컴파일 기반 프로그래밍 기법도 지원을 한다.

 

5. IDE 친화적

 

- 자동완성, 타입 힌트. 리팩토링 기능이 강력하게 작동한다.

 

6. 점진적 적용 가능

 

- 기존 JS 프로젝트에 .ts 파일 하나씩 추가하면서 점진적으로 도입이 가능하다.

 

 

프로젝트 만들때 기본 설정해야 하는 tsconfig.json 설정 

{
    "compilerOptions": {
        "target": "ESNext",
        "module": "EXNext",
        "outDir": "dist",
        "strict": false,
        "moduleDetection": "force",
        "skipLibCheck": true
    },
    "ts-node": {
        "esm": true
    },
    "include": ["src"]
}

 

include: ["src"]

 

- TypeScript가 어떤 폴더의 파일을 컴파일 대상으로 삼을지 지정한다.

- "src" 폴더의 모든 .ts, .tsx 파일이 컴파일 대상이다.

 

ts-node

 

- ts-node는 TypeScript를 빌드 없이 바로 실행해주는 도구이다.

- "esm": true는 ESM(import/export) 모듈 방식을 지원하도록 설정한다.

- CommonJS(구) 환경에서는 오류가 발생한다.

 

target:"ESNext" 

 

- TS의 컴파일 했을떄의 자바스크립트 버전을 지정한다.

- ESNext는 최신 ECMAScript 문법을 유지하므로, Node.js 최신 버전이나 최신 브라우저에서

  실행할 수 있다.

 

module:"esNext"

 

- 어떤 모듈 시스템을 사용할지 지정한다.

 

outDir: "dist"

 

- TS 에서 컴파일된 자바스크립트 파일이 저장될 출력 폴더이다.

 

strict:false

 

- 엄격한 타입 검사를 끈다.

- true로 설정하면 사용자가 거의 모든 타입을 직접 지정해 주어야 한다.(미 실시할시 오류 발생)

 

moduleDetection: "force"

 

- .ts 파일을 무조건 모듈로 간주한다.(변수를 지역변수로 간주하고 모듈 단위로 취급한다.)

- 전역 스코프를 해제한다.

 

skipLibCheck: true

 

- node_modules의 타입정의 파일에 대한 검사를 생략한다. , 타입스크립트 버전이 업그레이드 되면서 

  기존에 있던 프로그램의 라이브러리가 통합 또는 변경되었기 때문에 해당 외부 라이브러리의 타입 에러를

  무시하는 해당코드를 작성해 주어야 한다.