러닝 타입스크립트

274

3

부

사용법

13.4

대체 확장자대체 확장자

타입스크립트는 기본적으로 확장자가

.

ts

인 모든 파일을 읽을 수 있습니다. 그러나 일부 프로

젝트는

JSON

모듈 또는 리액트와 같은

UI

라이브러리를 위한

JSX

구문처럼 확장자가 다른 파

일을 읽을 수 있어야 합니다.

13.4.1 13.4.1

JSXJSX

구문구문

<

Comment

/>

같은

JSX

구문은 프리액트

Preact

와 리액트 같은

UI

라이브러리에서 자주 사용합

니다.

JSX

구문은 기술적으로 자바스크립트가 아닙니다. 타입스크립트의 타입 정의와 마찬가

지로 자바스크립트로 컴파일되는 자바스크립트 구문의 확장입니다.

const MyComponent = () => {

// 다음과 같음:

// return React.createElement("div", null, "Hello, world!");

return <div>Hello, world!</div>;

};

파일에서

JSX

구문을 사용하기 위해서는 다음 두 가지를 수행해야 합니다.

●

구성 옵션에서

"jsx"

컴파일러 옵션을 활성화합니다.

●

.tsx

확장자로 파일의 이름을 지정합니다.

jsx

타입스크립트가

.

tsx

파일에 대한 자바스크립트 코드를 내보내는 방법은

"

jsx

"

컴파일러 옵션에

사용되는 값으로 결정됩니다. 프로젝트는 [표

13

-

1

]에 있는