오랜만에 리액트 작업을 하려고 create-react-app을 했더니 에러가 나타나고 npm start 하면 에러 화면이 나타난다.
대충 살펴보면 react@19.0.0이 @testing-library/react@13.4.0과 안 맞는다는 내용인 듯.
Installing template dependencies using npm...
npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: test1@0.1.0
npm error Found: react@19.0.0
npm error node_modules/react
npm error react@"^19.0.0" from the root project
npm error
npm error Could not resolve dependency:
npm error peer react@"^18.0.0" from @testing-library/react@13.4.0
npm error node_modules/@testing-library/react
npm error @testing-library/react@"^13.0.0" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.
npm error
npm error
npm error For a full report see:
npm error /home/hs/.npm/_logs/2024-12-17T03_11_33_175Z-eresolve-report.txt
npm error A complete log of this run can be found in: /home/hs/.npm/_logs/2024-12-17T03_11_33_175Z-debug-0.log
`npm install --no-audit --save @testing-library/jest-dom@^5.14.1 @testing-library/react@^13.0.0 @testing-library/user-event@^13.2.1 web-vitals@^2.1.0` failed
npm start 하면 아래처럼 에러가 나타난다.
일단 web-vitals 문제로 보임.
만든 폴더로 가서 npm install web-vitals 해주면 문제없이 실행된다.
이번엔 yarn을 이용해서 cra를 해줬다. yarn은 문제없이 생성되고 실행도 문제없었다.
package.json을 살펴보면 npx로 생성한 것(왼쪽)과 yarn으로 생성한 것(오른쪽)의 차이가 보인다.
npx는 testing-library가 빠져있는 반면, yarn은 들어가 있다.
npx로 생성한 package.json은 web-vitals이 빠져있어서 npm start 시 위와 같은 에러가 나왔다.
내 컴터 문제는 아닌 거 같고 npx의 문제인 듯 하니 시간이 지나면 해결되어 있을 걸로 보인다.
당장 web-vitals를 설치해서 사용은 가능하지만 추후 혹시 모를 문제가 나타날지 모르니 일단 yarn으로 생성해서 사용해야겠다.