본문 바로가기
Programming/TypeScript

[TypeScript] TypeScript를 JavaScript로 컴파일 하는 방법

by 혀코 2022. 12. 28.

안녕하세요.

TypeScript는 Microsoft에서 개발한 언어로 JavaScript를 포함하는 언어이지만 브라우저에서 작동하지 않기에 JavaScript로 컴파일해줘야 합니다.

그래서 이번 시간에는 TypeScript를 JavaScript로 컴파일 하는 방법에 대해서 알아보겠습니다.

 

우선 다음 명령어를 사용해서 TypeScript를 전역으로 설치합니다.

$ npm install -g typescript

 

프로젝트 폴더에 index.html 파일을 만들고 app.js를 불러올 수 있도록 코드를 작성합니다.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="app.js" defer></script>
</head>
<body>
  
</body>
</html>

 

그리고 app.ts 파일을 생성합니다. 여기서 만든 app.ts 파일을 컴파일해서 app.js 파일로 만들어서 사용할 겁니다.

console.log("Hello World")

 

글 처음에 언급했듯이, TypeScript는 JavaScript를 포함하는 언어이기 때문에 JavaScript의 문법 그대로 사용하면 됩니다.

다음 명령어를 사용해서 app.ts 파일을 app.js 파일로 컴파일합니다.

$ tsc app.ts

 

그러면 app.js 파일이 생성됩니다.

console.log("Hello World")

 

이 컴파일된 app.js 파일이 HTML 이 로드가 완료되고 나서 실행되는 파일입니다.

 

이렇게 TypeScript를 JavaScript로 컴파일 하는 방법에 대해서 알아봤습니다.

유용하셨다면, 공감과 구독 부탁 드립니다.

감사합니다.

 

댓글