Create-React-App TypeScript 템플릿을 사용할 때 문제가 발생하면 출력이 TSX 파일 대신 JS 파일입니다.
P粉680487967
P粉680487967 2023-08-17 13:21:24
0
1
518

Create-React-App 템플릿과 TypeScript를 사용하여 새로운 React 애플리케이션을 만들려고 시도하는 동안 문제가 발생했습니다. 공식 문서(https://create-react-app.dev/docs/adding-typescript/)의 지침을 따르고 다음 명령을 사용했습니다.

npx create-react-app my-app --template typescript

명령의 결과는 다음과 같습니다.

소프트웨어 패키지 설치 중. 몇 분 걸릴 것이다. 사용 중인 반응 스크립트 버전이 --template 옵션과 호환되지 않습니다. 반응, 반응 돔 및 반응 스크립트 설치 중... 32초 만에 995개의 패키지 추가 자금을 찾고 있는 패키지가 34개 있습니다. 자세한 내용을 보려면 `npm Fund`를 실행하세요. 성공! My-app-test는 /home/ristirianto/belajar-react/my-app-test 아래에 생성되었습니다. 이 디렉터리 내에서 여러 명령을 실행할 수 있습니다. npm 시작 개발 서버를 시작합니다. npm 실행 빌드 애플리케이션을 프로덕션용 정적 파일로 패키징합니다. npm 테스트 테스트 실행기를 시작합니다. npm 실행 꺼내기 도구를 제거하고 빌드 종속성, 구성 파일 및 스크립트를 애플리케이션 디렉터리에 복사합니다. 이렇게 하면 돌아올 수 없습니다! 다음을 입력하여 시작하는 것이 좋습니다. CD 내 앱 테스트 npm 시작 즐거운 프로그래밍 되세요! 참고: 이 프로젝트는 지원되지 않는 도구의 이전 버전을 사용하여 부트스트랩됩니다. 새 프로젝트에서 지원되는 도구를 얻으려면 Node >=14 및 npm >=6으로 업데이트하세요. 

내 노드 버전: v18.17.1 내 NPM 버전: 9.6.7

그러나 설치 과정을 마친 후 my-app 폴더에 있는 파일을 확인해보니 파일 확장자가 .js인 것을 발견했습니다. TypeScript 파일은 .tsx 대신에 있어야 합니다. 이는 TypeScript가 올바르게 구성되지 않았음을 나타내는 것 같습니다.

제가 놓친 단계가 있는지 아니면 설정에 문제가 있는 것인지 잘 모르겠습니다. --template typescript 옵션을 사용할 때 TypeScript가 올바르게 구성되었는지 확인하기 위해 수행해야 하는 단계가 있습니까?

이 문제를 해결하는 방법에 대한 지침이나 조언을 주시면 감사하겠습니다. 도움을 주셔서 미리 감사드립니다!

P粉680487967
P粉680487967

모든 응답 (1)
P粉852114752

질문

사용 중인create-react-app版本不支持--template选项。因此,--template typescript没有任何效果,您的项目中没有生成.tsx파일입니다.

npx create-react-app不使用支持--template的版本,我怀疑您在本地全局安装了旧版本的create-react-app. 나는 이것이 다음과 같은 이유 때문이라고 생각합니다:

  1. npx로컬에 설치된 패키지를 실행할 수 있습니다(원격 패키지에 국한되지 않음):

    npx문서

  2. npx원격 패키지 설치 여부를 묻는 메시지가 표시되지만 출력에는 이 메시지가 표시되지 않습니다. 팁은 다음과 같습니다:

    으아악

전역적으로 설치된 패키지를 확인하면 위의 내용을 확인할 수 있습니다.

  • npm:npm list -g
  • 실:yarn global list

솔루션

전역적으로 설치했는지 확인한 후create-react-app제거할 수 있습니다.

  • npm:npm uninstall -g create-react-app
  • 실:yarn global remove create-react-app

create-react-app또한 전 세계적으로 버전을 설치하지 않는 것이 좋습니다.

시작 가이드: 빠르게 시작하고 React 앱 만들기

    최신 다운로드
    더>
    웹 효과
    웹사이트 소스 코드
    웹사이트 자료
    프론트엔드 템플릿
    회사 소개 부인 성명 Sitemap
    PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!