npx create-react-app 에러

1. 상황

짐코딩님의 강의를 듣는 중 npx 명령어를 통해서 리액트 프로젝트를 생성했더니 에러가 발생하였다.

$  npx create-react-app cra-react-app
Creating a new React app in /Users/manijang2/VSProjects/cra-react-app.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...


added 1324 packages in 27s

268 packages are looking for funding
  run `npm fund` for details

Initialized a git repository.

Installing template dependencies using npm...
npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: cra-react-app@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 /Users/manijang2/.npm/_logs/2025-02-03T14_04_47_393Z-eresolve-report.txt
npm error A complete log of this run can be found in: /Users/manijang2/.npm/_logs/2025-02-03T14_04_47_393Z-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

2. 해결방법

$  npm install --save-dev web-vitals

3. 해결과정

보기

1. 리액트 로그를 볼 줄 몰라 무작정 검색하였다. 그래서 일단, 버전 문제라는 것을 알았다.

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

리액트 19버전으로 올라가면서 테스트 관련 모듈과의 호환성이 깨졌고, 리액트를 18 버전으로 내리는 것으로 결정하였다.

18버전의 현재 버전은 18.3 이라는 사실을 확인한 후 아래 명령어를 실행하고, package.json에 리액트 변경된 것을 확인한 후 다시 실행하였다.

$  npm install react@18.3.1 react-dom@18.3.1

{
  // ...
  "dependencies": {
    "cra-template": "1.2.0",
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "react-scripts": "5.0.1"
  }
  // ...
}

2. 다시 실행해보니 그래도 에러가 발생한다. 그런데 에러 내용이 다르다.