JS 파일에서 JSX 구문 사용을 지원하도록 Vite를 구성하는 방법

Question

<p>Vite는 기본적으로 .js 파일에서 JSX 구문 사용을 허용하지 않습니다. </p> <p>파일 이름을 <code>.jsx</code>(또는 <code>.tsx</code>)로 변경했지만 이름을 변경할 수 없는 일부 외부 종속성이 있습니다. </p> <p>Vite 오류 예:</p> <pre class="brush:php;toolbar:false;">✘ [오류] JSX 구문 확장이 현재 활성화되어 있지 않습니다. node_modules/somelib/src/someFile.js:122:11: 122 │ 반환

<p>모든 .js 파일에서 JSX 표현식을 지원하도록 Vite를 구성하는 방법은 무엇입니까? </p>

P粉571233520459일 전684

Answer 1

loader 옵션을 사용하여 모든 js 파일을 jsx로 처리하여 esbuild 구성을 변경할 수 있습니다.

으아악

참고: .jsx 로더를 사용하여 .js 파일을 로드하면 성능이 저하됩니다.

답은 Vite GitHub의 이 토론에서 나오며 잘못된(이전) 답변을 "올바른"으로 표시합니다.

2023년 3월 업데이트

vite build中无法正常工作，只能在vite dev中正常工作。当前版本在vite@^4.0.0의 원래 답변은 두 가지 모두에 적용됩니다.

솔루션을 복제하고 테스트할 수 있는 예제 저장소입니다.