인프런 커뮤니티 질문&답변

김주원님의 프로필 이미지
김주원

작성한 질문수

[D.P.(DappProject)] 디앱 프로젝트(NFT 생성, NFT 구매 및 판매)

프론트엔드 셋팅 1 (ChakraUI, React-Router-Dom)

chakra ui 에러

작성

·

801

1

chakra ui 사용하는 과정에서 에러가 생깁니다.

npm i @chakra-ui/react @emotion/react@^11 @emotion/styled@^11 framer-motion@^6 해서 설치하고 npm 버전도 6으로 낮췄고 여기까지는 정상적으로 실행되고,

config-overrides.js 파일 생성, npm i react-app-rewired 사용후 package.json 파일에서 app-rewired로 수정 완료 했습니다.

그리고 npm run start 돌려보니 

Failed to compile.

./node_modules/@chakra-ui/modal/dist/index.esm.js
SyntaxError: /Users/jk/Documents/GitHub/polygon-nft/frontend/node_modules/@chakra-ui/modal/dist/index.esm.js: Missing class properties transform.
  71 | import { useEffect } from "react";
  72 | var ModalManager = class {
> 73 |   modals;
     |   ^
  74 |   constructor() {
  75 |     this.modals = [];
  76 |   }

라는 에러가 계속 뜨는데 아직 해결 방안을 못찾고 있습니다.

이럴 경우 어떻게 해야하나요?

답변 1

3

저 같은 경우에는 차크라 ui 가 버전 2로 설치되어있고 리액트는 17버전이어서 버전 오류로 나오지 않았습니다. 

그래서 node_modules , package-lock.json 파일을 삭제 후 package.json 파일에서 @chakra-ui/react 버전을 1.8.8 로 바꾸고 재설치하니 오류 해결했습니다.

김주원님의 프로필 이미지
김주원

작성한 질문수

질문하기