타입스크립트: 모듈

 

 

외부 자바스크립트 모듈을 타입스크립트로 가져올 때

 

lodash를 가져온다고 가정

 

검색

$ npm info @types/모듈이름

설치

$ npm i -D @types/lodash

 

 

main.ts

// main.ts

import * as _ from 'lodash';

console.log(_.camelCase('import lodash module'));
console.log(_.snakeCase('import lodash module'));
console.log(_.kebabCase('import lodash module'));

 

$ npx ts-node main.ts
# importLodashModule
# import_lodash_module
# import-lodash-module

정상작동 확인

 

 

 

 

- 타입선언을 찾을 수 없는 js모듈

- 가지고 있는 타입 선언을 수정해야 하는 경우

 

직접 타이핑해야하는데 이때, 컴파일 옵션 typeRoots를 사용하면 쉽게 관리 가능

 

1. index.d.ts 파일 생성

 

내용

// types/lodash/index.d.ts

declare module 'lodash' {
  interface ILodash {
    camelCase(str?: string): string
  }
  const _: ILodash;
  export = _;
}

 

 

2. tsconfig에 컴파일 옵션 추가

컴파일러 옵션

"types" : ["lodash"] 디렉토리에서 lodash의 타입 선언만을 사용

"types" : [] 모든 모듈의 타입 선언 사용하지 않음

types 사용 ❌ 디렉토리 모든 모듈 타입 선언

 

일반적인경우 type옵션을 작성할 필요 ❌