[TIL] 0601 | Cloudflare로 Vite React 프로젝트를 빌드했을 시에 나타나는 오류를 해결해보자

Teasan·2023년 6월 1일

TIL

목록 보기

25/36

현재 프로젝트는 CRA가 아니라, Vite로 세팅해주었는데 이 때문에 Cloudflare에서 배포했을 시에 아래와 같은 오류가 발생했다.

구글링을 해보니, 아래와 같은 현자의 대답을 발견했고 간단하게 문제를 해결할 수 있었다.

Vite 프로젝트의 경우, node 버전에 대한 환경 변수를 설정해주지 않으면 Cloudflare에서 12.18.0 버전으로 디폴트 설정되기 때문에 Vite의 버전과 호환이 되지 않기에Cloudflare에서 빌드 에러가 발생한 것이다.

현재 내 로컬 환경에서의 node 버전은 18.13.0 이고, 로컬에서 빌드했을 시 큰 문제가 없었으므로 해당 버전으로 환경 변수를 설정해주었다.

해당 프로젝트의 settings 탭으로 들어가 환경 변수를 설정해주는 섹션에서 NODE_VERSION 이라는 이름으로 내 로컬 환경에서의 node 버전 값(18.13.0)을 넣어주면 끝이다.

Production과 Preview 둘다 배포해주고 있었으므로 양쪽 다 동일하게 설정해주고 빌드를 다시 돌려보면 정상적으로 빌드가 성공하는 것을 알 수 있다!

일단 공부가 '적성'에 맞는 개발자. 근성있습니다.