* 자바스크립트로 만들어진 패키지를 타입스크립트에서 사용하는 법
1. d.ts 생성하기
1)
import _ from "lodash"; // lodash 패키지를 사용하고 싶은데 npm i 해도 안됨
const str = "hi hi hiiiiii";
console.log(_.camelCase(str));
console.log(_.snakeCase(str));
=> 이유 : lodash는 자바스크립트로 만들어져있음
타입스크립트에서 가져오려면 타입 선언이 필요함
2-1) 해결 : lodash.d.ts 파일 생성하기(패키지 이름으로 d.ts파일 생성)
declare module "lodash" {
interface Lodash {
camelCase: (str: String) => string;
snakeCase: (str: String) => string;
}
const _: Lodash;
export default _;
}
2-2) 해결 : main.d.ts 파일 생성하기(패키지 이름이 아닌 d.ts파일 생성)
declare module "lodash" {
interface Lodash {
camelCase: (str: String) => string;
snakeCase: (str: String) => string;
}
const _: Lodash;
export default _;
}는 똑같고,
/// <reference path="./main.d.ts"/> //삼중 슬래시 지시자(///)를 통해, 참조태그로 경로 명시
import _ from "lodash";
const str = "hi hi hiiiiii";
console.log(_.camelCase(str));
console.log(_.snakeCase(str));
+.d.ts파일에서의 d는 ? declare(선언)
2. 실제 존재하는 선언 사용하기
1) Definitely typed 검색 -> github이동
2) npm install --save-dev @types/사용할 패키지의 이름
//타입 선언의 패키지가 존재하다면 해당 내용이 설치 되므로 프로젝트에서 읽어 올 수 있음
- 실제 존재하는 선언 사용하는 방법
1)패키지가 존재하는지 확인
npm info --save-dev @types/lodash
2) 패키지가 있다면 설치(개발 의존성 패키지로 설치)
npm install @types/lodash -D
'개인공부 > typescript' 카테고리의 다른 글
타입스크립트 총 정리 (0) | 2023.11.05 |
---|---|
타입스크립트 : tsconfig.json 옵션 (0) | 2023.09.06 |
타입스크립트 : 제네릭 문법(함수, 클래스, 인터페이스) (0) | 2023.09.05 |
타입스크립트 : 클래스 (0) | 2023.09.05 |
타입스크립트 : 함수의 명시적 this타입, 오버로딩 (0) | 2023.09.05 |