자바스크립트의 ES6+의 Modules 개념과 유사하다. 모듈화란 쉽게 말해서 다른 파일에 있는 자바스크립트의 코드를 특정 파일에서 사용할 수 있는 것을 의미한다.
타입스크립트에서는 특정 인터페이스나 타입을 다른 여러 파일에서 사용해야 할 경우가 있는데, 그럴 때 export
로 내보내고 import
로 들여와서 사용을 할 수 있다.
//types.ts
export interface Todo {
title: string;
checked: boolean;
}
// app.ts
import { Todo } from './types';
//from의 경로부터 작성해 주는 것이 좋다. 경로가 맞으면 객체안에 자동완성이 될 수 있다.
var item: Todo = {
title: '할 일1',
checked: false,
};
다른 파일에서 가져다 쓸 변수나 함수의 앞에 export
라는 키워드를 붙인다. export된 파일은 import로 불러와 사용할 수 있습니다.
export 변수, 함수
또는 파일의 맨 하단에서
export { 변수, 함수 }
export된 변수나 함수를 { }에 선언한 뒤 해당 파일이 있는 경로를 적어준다.
import { 불러올 변수 또는 함수 이름 } from '파일 경로';