설정

Node.js 환경에서 타입스크립트 시작하기

$ npm init -y                // package.json 파일 생성
$ npm install -D typescript  // 타입스크립트 설치
$ touch tsconfig.json        // 타입스크립트 설정 파일 생성 (파일명 변경 불가) 
$ npm run build              // typescript -> javascript 빌드
$ npm i -D ts-node           // 빌드없이 실행 시켜주는 모듈, 개발환경에서만 사용
$ npm i nodemon              // 자동으로 커맨드 재 실행

package.json

{
  "name": "typechain",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "build": "tsc",
    "dev": "nodemon --exec ts-node src/index.ts",
    "start": "node build/index.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "ts-node": "^10.9.1",
    "typescript": "^4.9.4"
  },
  "dependencies": {
    "nodemon": "^2.0.20"
  }
}

tsconfig.json

{  
    "include": ["src"],        // 빌드할 디렉터리 지정 (src 디렉터리만 빌드)
    "compilerOptions": {
			"outDir": "build",       // 출력할 디렉터리 지정 (build 디렉터리에 js 파일 생성)
			"target": "ES6",         // 호한 javascript 버전 선택, ES6가 좋은 선택
			"lib": ["ES6", "DOM"],   // 어디서 동작할 것인지 지정, 자동완성 기능 제공(DOM은 브라우저 환경)
                               // 해당한는 definition file 참조
			"strict": true,          // 더 엄격한 모드로 타입스크립트 보호
			"allowJs": true,         // typescript에서 javascript 허용
			"esModuleInterop": true, // import default 없는 문제 해결해줌,
														   // 해당 옵션 안쓰면 import * as crypto from "crypto" 이런식으로 사용
      "module": "CommonJS"     // CommonJS 모듈을 쓰겠다고 선언
		}
}

javascript 모듈을 정의해(타입을 알려주어) typescript 에서 사용하는 법

• packageName.d.ts 파일(definition file) 에 call signature 작성

myPackage.js

export function init(config) {
    return true;
}
export function exit(code) {
    return code + 1;
}

myPackage.d.ts

interface Config {
    url: string;
}
declare module "myPackage"{
    function init(config: Config): boolean;
    function exit(code: number): number;
}

index.ts

import {init, exit} from "myPackage"

init({url:"true"});

exit(1);

JavaScript와 TypeScript를 섞어서 사용하되 기존 JavaScript 파일을 수정하지 않고 어느정도 보호받는 법

• tsconfig.json 에서 allowjs : ture로 설정
• JavaScript 코드 상단에 //@ts-check 추가
• JSDoc 사용

myPackage.js

//@ts-check
/**
 * Initializes the project
 * @param {object} config 
 * @param {boolean} config.debug
 * @param {string} config.url
 * @returns {boolean} 
 */
export function init(config) {
    return true;
}
/**
 * Exits the program
 * @param {number} code 
 * @returns {number}
 */
export function exit(code) {
    return code + 1;
}

allowJs 허용해주지 않아도, definition file을 직접 정의해 주지 않아도 js 모듈을 사용하는 방법

DefinitelyTyped

• 엄청나게 큰 깃 레퍼지토리, 많은 사람이 사용하고 있음
• 타입 정보만 존재
• npm i -D @types/node : node 패키지의 정의된 모든 타입을 가져옴