많은 프로젝트가 자바스크립트로 시작되지만, 점차 유지보수의 효율성을 높이고 버그를 줄이기 위해 타입스크립트로 전환이 필요해집니다. 그러나 기존의 수많은 자바스크립트 코드를 모두 수작업으로 타입스크립트로 변환하는 것은 번거로운 작업입니다. 다행히도, 이러한 과정은 자동화될 수 있습니다. 이번 글에서는 이를 위한 간단한 예시를 살펴보겠습니다.

1. Babel 설치

우선, 자바스크립트 코드를 타입스크립트로 변환하기 위해 Babel을 이용할 것입니다. Babel은 JavaScript 컴파일러로, 다양한 확장 가능한 플러그인을 통해 코드 변환을 지원합니다.

npm install @babel/cli @babel/preset-typescript --save-dev

2. Babel 설정

프로젝트 루트에 .babelrc 파일을 생성하고 아래와 같이 설정합니다.

{
  "presets": ["@babel/preset-typescript"]
}

3. 변환 명령어 추가

package.json 파일의 scripts 부분에 다음과 같이 자동 변환 스크립트를 추가합니다.

{
  "scripts": {
    "build:typescript": "babel src --out-dir dist --extensions \".js,.jsx,.ts,.tsx\""
  }
}

이제 npm run build:typescript 명령어를 실행하면 src 폴더의 자바스크립트 파일이 타입스크립트로 변환되어 dist 폴더에 저장됩니다.

이렇게 함으로써 자바스크립트 프로젝트를 타입스크립트로 자동 변환하는 간단한 과정을 살펴보았습니다. 이를 통해 기존 자바스크립트 코드베이스를 타입스크립트로 쉽게 이관할 수 있게 되었습니다.

참고 자료

• Babel 공식 문서: https://babeljs.io/docs/en
• 타입스크립트 공식 문서: https://www.typescriptlang.org/docs/
• Babel 타입스크립트 프리셋: https://babeljs.io/docs/en/babel-preset-typescript