TypeScript에서는 다양한 모듈 시스템을 사용할 수 있습니다. 각각의 모듈 시스템은 특정한 상황에 맞게 선택하여 사용할 수 있습니다. 주요한 모듈 시스템으로는 CommonJS, AMD, SystemJS, UMD, ES6 등이 있습니다. 각 모듈 시스템은 다음과 같은 특징을 가지고 있습니다.

CommonJS

CommonJS는 Node.js에서 사용되는 모듈 시스템으로, require와 module.exports를 사용하여 모듈을 가져오거나 내보냅니다. 이는 동기적으로 동작하며, 서버 사이드 JavaScript 환경에서 주로 사용됩니다.

예시:

// 모듈 가져오기
const myModule = require('./myModule');

// 모듈 내보내기
module.exports = { myFunction };

AMD (Asynchronous Module Definition)

AMD는 브라우저 환경에서 비동기적으로 모듈을 관리하기 위한 모듈 시스템입니다. 주요 라이브러리인 RequireJS에서 사용되며, define 함수를 이용하여 모듈을 정의하고 가져옵니다.

예시:

// 모듈 정의
define(['dependency'], function(dependency) {
  // 모듈 내용
  return myModule;
});

UMD (Universal Module Definition)

UMD는 여러 환경에서 모듈을 사용할 수 있도록 만들어진 표준이 아닌 모듈 시스템입니다. 이러한 특성 때문에 브라우저 및 Node.js와 같이 서로 다른 환경에서 모듈 코드를 재사용할 수 있습니다.

ES6 (ES2015) 모듈

ES6 모듈은 표준화된 자바스크립트 모듈 시스템으로, import와 export 키워드를 사용하여 모듈을 가져오고 내보냅니다. 이 모듈 시스템은 정적 분석이 가능하며, 트리 쉐이킹과 같은 최적화 기법을 이용하여 불필요한 코드를 제거할 수 있습니다.

예시:

// 모듈 가져오기
import myModule from './myModule';

// 모듈 내보내기
export default myFunction;

모듈 시스템은 프로젝트의 요구 사항과 환경에 따라 선택되어져야 합니다. 따라서, 각 모듈 시스템의 장단점을 고려하여 적절한 모듈 시스템을 선택하여 사용해야 합니다.

참고 자료

• TypeScript Handbook - Modules