tsconfig.json에서 'jsx' 속성의 용도는 무엇입니까?

tsconfig.json에서 'jsx' 속성의 용도는 무엇입니까?

tsconfig.json을 생성했습니다.tsc --init,

그리고 나서 .tsx 파일에 반응 코드를 적었고 오류가 발생했습니다.Cannot use JSX unless the '--jsx' flag is provided

나는 이것을 우연히 발견했습니다.jsx의 설정.tsconfig

정말 그랬어요.jsx라고 평한 상태에서.

// "jsx": "preserve", /* Specify JSX code generation: 'preserve', 'react-native', or 'react', 'react-jsx'. */

그래서 그 세 가지 옵션은 무엇을 의미합니까?다시 말하면preserve,react-native그리고.react

jsx속성을 통해 프로젝트에서 .tsx 파일을 사용할 수 있습니다.

다음은 React with Typescript를 사용하는 두 단계입니다.

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

2.jsx 옵션을 활성화

TypeScript는 보존, 반응 및 반응 네이티브의 세 가지 JSX 모드로 제공됩니다.

이러한 모드는 배출 단계에만 영향을 미칩니다. 유형 검사는 영향을 받지 않습니다.

모드는 출력의 일부로 JSX를 유지하여 다른 변환 단계(예: Babel)에서 추가로 소비합니다.또한 출력의 확장자는 .jsx입니다.

그react모드는 React.createElement를 내보내고 사용하기 전에 JSX 변환을 수행할 필요가 없으며 출력의 확장자는 .js입니다.

그react-native모드는 모든 JSX를 유지한다는 점에서 보존과 동일하지만 출력에는 .js 파일 확장자가 있습니다.

react-jsx(React 17 관련) 모드를 사용하면 jsx가 사용되는 모든 파일에서 React를 가져올 필요가 없습니다. 즉, React가 방출됩니다.

React는 React.createElement를 사용하지 않고 JSX를 자동으로 변환하는 React 17 릴리스에서 새로운 JSX 변환을 도입했습니다.이렇게 하면 React를 가져올 수 없지만 React가 https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html 에서 제공하는 Hooks 및 기타 내보내기를 사용하려면 React를 가져와야 합니다.

https://www.typescriptlang.org/docs/handbook/jsx.html#basic-usage

언급URL : https://stackoverflow.com/questions/62859458/what-is-the-use-of-jsx-property-in-tsconfig-json