React 19 출시 후 CRA 중단 관련 이슈 정리

김정혁·2025년 1월 27일

React 19 출시 후 CRA 중단 관련 이슈 정리

CRA 퇴장의 주요 배경

1. GitHub 이슈 #17004의 영향

React 팀이 "CRA가 React 19의 주요 기능(예: 서버 컴포넌트)을 지원할 기술적 역량 부족" 공식 선언
기술적 부채 누적: Webpack 4, Babel 7, eslint 8 모두 deprecated 상태
RSC 지원을 위한 Webpack 5+ 및 Turbopack 통합 불가능

Dan Abramov의 코멘트:
"CRA는 React의 진화를 따라가지 못했습니다. 이제 커뮤니티가 더 나은 솔루션을 만들었으니, 우리는 그 에너지를 React 코어 개발에 집중할 것 입니다."

2. 현재 발생 중인 문제

React 19 출시 이후 create-react-app my-app 실행 시 NPM 오류 발생
- CRA의 최신 React 버전 자동 설치
- 템플릿 패키지의 버전 미명시
- React Testing Library의 peer dependency 불일치
- NPM의 엄격한 peer dependency 정책
문서화 및 안내 부재
- CRA 문서, README, CLI에 deprecation 경고 없음
- 많은 튜토리얼에서 여전히 CRA 사용 안내
- 초보자들의 주요 진입점으로 남아있음

해결 방안

즉각적인 해결책

RTL 템플릿 버전 업데이트
- React 19 호환 버전으로 업그레이드
- PR: fix: upgrade RTL version to avoid peer-deps mismatch #13738
명확한 deprecation 안내
- CRA CLI에 deprecation 메시지 추가
- 문서와 README 업데이트

대체 솔루션 매트릭스

도구	강점	권장 사용 사례
Vite	⚡ 초고속 빌드 🛠️ 플러그인 확장성 🌟 React 공식팀 암묵적 추천	CSR 기반 SPA CRA 마이그레이션 1순위
Next.js	🖥️ 서버 컴포넌트 🔌 풀스택 통합	SSR/ISR 필요 애플리케이션
Remix	🧩 네스티드 라우팅 📦 번들 크기 최적화	복잡한 라우팅 구조 프로젝트
Gatsby	📄 컨텐츠 중심 SSG 🔍 SEO 최적화	마크다운 기반 정적 사이트

마이그레이션 전략

점진적 전환

npm run eject # CRA 설정 추출
# vite-plugin-react 컴포지션 API로 점진적 이식

신규 프로젝트: npm create vite@latest
Next.js 활용: create-next-app

React 문서 개선 필요성

현재 문서의 한계
- Vite 언급 위치: 접을 수 있는 세부 섹션/기존 프로젝트 가이드
- CRA 대체 도구로의 명확한 경로 제시 부재
- 커뮤니티 표준 도구 반영 미흡

개선 제안

[React 공식 문서 제안]

- "클라이언트 전용 SPA 생성" 섹션 신설
- `create-vite`를 기본 시작점으로 명시
- CRA → Vite 마이그레이션 가이드 별도 작성

장기적 개선 방향

React 공식 문서 개선 🔧
- 신규 섹션 추가: "Modern SPA Starter"
```
npm create vite@latest my-app -- --template react
```
- Vite를 CRA의 자연스러운 후속 도구로 위치 재정립
- Next.js(풀스택) vs Vite(클라이언트) 선택 트리 명확화
CRA 문서 개선
- legacy.create-react-app.dev로 이전
- 대체 도구 안내 강화

결론

CRA의 중단은 React 생태계가 초보자 친화성에서 고성능 프로덕션 도구로 성장한 자연스러운 결과입니다. 신규 프로젝트는 Vite나 Next.js를, 기존 프로젝트는 점진적 전환을 고려해야 할 시점입니다. 이는 React 커뮤니티가 더 나은 개발자 경험을 추구하는 진화의 과정으로 이해할 필요가 있습니다.