[React] React 프로젝트 git clone으로 받아와서 작업하기 (npm build failed with error code 1 오류 해결)

DRF로 구축한 백엔드 API 서버와 React로 구축한 프론트단을 연결해보기 위해 공부하면서 책 저자님의 깃허브에서 리액트 프로젝트를 clone해서 사용하려고 했다.

 

npm install로 package-json module을 업데이트 해준 뒤, npm start를 해주면 에러 메세지가 길게 나오면서 npm build failed with error code 1 라는 오류 메세지가 나왔다.

https://codingapple.com/forums/topic/%EC%B5%9C%EC%8B%A0%EB%B2%84%EC%A0%84-%EA%B9%94%EC%95%98%EC%9D%84%EC%8B%9C-%EC%9D%B4%EB%9F%B0-%EC%97%90%EB%9F%AC%EA%B0%80-%EB%96%A0%EC%9A%94/

최신버전 깔았을시 이런 에러가 떠요 - 코딩애플 온라인 강좌

위의 링크와 같은 내용이었고, 해결 방법도 위 글을 참고하였다.

 

오류 메세지를 잘 확인해보니 node-sass라는 것의 버전이 현재 로컬의 nodejs버전과 맞지 않아서 생기는 오류 같았다.

내 로컬에 설치한 nodejs의 버전은 아래와 같았다.

아래 링크에 가보면 node버전 별로 호환되는 node-sass의 버전이 명시되어 있다.

https://www.npmjs.com/package/node-sass

node-sass

node-sass의 버전이 4.14? 정도 였기 때문에 node 버전에 맞게 node-sass를 삭제한 뒤 8.0 버전으로 업데이트 해주었다.

그 다음 프로젝트 폴더 내에 node_modules 폴더, yarn.lock, package-lock.json 을 다 삭제해주고 npm install로 node_modules 폴더를 재설치 해주었다.

(npm install에서 에러가 나서 npm install --verbose와 npm audit fix --force 도 해주었다.)

리액트 프로젝트의 package.json 에서 node-sass의 버전을 확인해보면 8.0 버전으로 업그레이드가 된 것을 확인해 볼 수 있다.

 

이 후 npm start를 해보니 잘 실행되었다.