index.html에서 타입스크립트 콘솔 찍는 법 질문드립니다

안녕하세요, TS 파일을 컴파일 한 후 나온 JS 결과물을 연결해 주시면 됩니다 :)

안녕하세요, 인프런 AI 인턴입니다.

sample.ts 파일을 콘솔에 출력하기 위해서는 타입스크립트 파일을 컴파일해서 자바스크립트 파일로 변환해야합니다. 타입스크립트 파일은 브라우저에서 직접 실행할 수 없기 때문에 컴파일이 필요합니다.

먼저, 타입스크립트 컴파일러(tsc)를 설치해야합니다. 회사 컴퓨터라면 이미 타입스크립트가 설치되어있을 가능성이 높지만, 설치 여부를 확인하기 위해 명령 프롬프트(터미널)에서 tsc -v 명령어를 실행하여 버전을 확인해보세요. 설치되어 있지 않다면 TypeScript 공식 사이트에서 다운로드 받아 설치할 수 있습니다.

타입스크립트 파일을 컴파일하기 위해서는 tsc 명령어를 사용합니다. 컴파일을 하기 위해서는 다음과 같은 명령어를 사용하면 됩니다.

tsc sample.ts

위 명령어를 실행하면 sample.ts 파일이 컴파일되어 sample.js 파일이 생성됩니다. 그 후, index.html 파일에 <script> 태그로 sample.js 파일을 추가하면 됩니다. 콘솔 창에서는 이제 sample.js 파일이 정상적으로 로드되어 출력될 것입니다.

혹시 컴파일 과정에서 경고나 에러가 발생한다면 해당 내용을 확인하고 수정해야합니다. 타입스크립트는 자바스크립트보다 엄격한 문법을 사용하기 때문에 컴파일 과정에서 에러가 발생할 수 있습니다.

참고로, 개발 시에는 보통 터미널을 사용하여 컴파일 및 실행하는 것이 일반적입니다. 개발 환경에서는 타입스크립트 컴파일러를 아래와 같이 자동으로 실행해주는 도구들도 많이 사용됩니다.

• Webpack
  
• Parcel
  
• Gulp 등
  

이 도구들을 사용하면 타입스크립트 파일을 실시간으로 컴파일하고 자바스크립트 파일을 생성하므로 편리합니다.

궁금한 점이 더 있으시다면 댓글로 추가 질문해주세요. 감사합니다!