TypeScript로 작성한 코드를 효과적으로 테스트하려면 적절한 테스트 환경을 설정해야 합니다. 이 글에서는 TypeScript 프로젝트에 테스트 러너와 모듈 로더를 설정하는 방법을 알아보겠습니다.

테스트 러너 설정

가장 일반적으로 사용되는 테스트 러너로는 Jest가 있습니다. Jest는 TypeScript를 지원하고, 강력한 기능과 풍부한 문서를 제공하여 많은 개발자들에게 사랑받고 있습니다.

먼저, 프로젝트에 Jest를 설치합니다.

npm install --save-dev jest @types/jest ts-jest

그리고 package.json 파일에 Jest의 설정을 추가합니다.

{
  "scripts": {
    "test": "jest"
  },
  "jest": {
    "preset": "ts-jest",
    "testEnvironment": "node"
  }
}

위의 설정은 ts-jest를 사용하여 TypeScript 파일을 테스트하고, node 환경에서 테스트를 실행하도록 지정합니다. 이제 npm test 명령어를 통해 프로젝트의 테스트를 실행할 수 있게 되었습니다.

모듈로더 설정

TypeScript 프로젝트에서는 ES 모듈 형식으로 코드를 작성하는 것이 일반적입니다. Jest를 사용하여 테스트를 작성할 때, ES 모듈을 지원하기 위해 ts-jest를 설치했습니다.

또한, Jest에서 모듈의 경로를 해석하기 위해 moduleNameMapper를 설정할 수 있습니다. 예를 들어, CSS 모듈이나 정적 리소스 파일을 모의(mock)할 수 있습니다.

tsconfig.json 파일에 다음과 같은 설정을 추가하여 ES 모듈을 사용하도록 지정할 수 있습니다.

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext"
  }
}

위의 설정을 추가하면, TypeScript 프로젝트에서 ES 모듈을 효과적으로 활용할 수 있게 됩니다.

결론

TypeScript 프로젝트에 테스트 환경을 설정하는 것은 매우 중요합니다. Jest를 테스트 러너로 사용하고, ES 모듈 형식으로 코드를 작성하도록 환경을 설정함으로써, 코드의 품질과 안정성을 확보할 수 있습니다.

이제 TypeScript 프로젝트의 테스트 코드 작성을 위한 환경 설정이 완료되었습니다.

참고:

• Jest 공식 문서
• ts-jest GitHub 저장소

예제 코드

// app.ts
export function sum(a: number, b: number): number {
  return a + b;
}

// app.test.ts
import { sum } from './app';

test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);
});

만약 추가적인 질문이 있으시다면 언제든지 물어보세요.