에러 발생
React 프로젝트에 ESLint를 적용한 후 각종 ESLint 규칙을 설정했습니다.
이 후 npm run start 실행이 정상적으로 되는 것을 확인하고, npm run buld를 실행했더니 다음과 같은 에러가 발생했습니다.
Error message
Treating warnings as errors because process.env.CI = true.
Failed to compile
위 메시지를 해석하면 process.env.CI = true 이기 때문에 warning을 error로 간주한다는 의미입니다.
해당 에러는 creat-react-app build 시 나타날 수 있는 에러로, React는 warning을 build 에러로 처리하기 때문입니다.
발생 원인
ESLint를 적용하면서 warn으로 설정한 규칙이 있었고, warning 상태인 코드들을 수정하지 않은 채 build를 했더니 에러가 발생했습니다.
warning이 발생하지 않도록 코드를 수정하는 것이 가장 좋은 방법이지만.. 꽤 복잡한 부분들이 있어서 차근차근 수정하기 위해 error가 아닌 warn으로 설정했던 것인데 React에서 build 에러로 간주하다니.. 당황스러웠습니다.
해결 방법
해결 방법은 생각보다 간단합니다.
에러 메시지에서 process.env.CI = true 이므로 warning을 error로 간주한다고 알려주었기 때문에 CI를 false 처리 해주면 됩니다!
build 스크립트에 CI=false를 추가해줍니다.
다음 예시에서 CI=false 다음 && 연산자를 넣어주었지만 넣지 않아도 정상적으로 실행됩니다.
// `&&` 연산자 O
"scripts": {
"start": "react-scripts start",
"build": "CI=false && react-scripts build", // CI=false 추가
"test": "react-scripts test",
},// `&&` 연산자 X
"scripts": {
"start": "react-scripts start",
"build": "CI=false react-scripts build", // && 연산자 없어도 정상적으로 실행
"test": "react-scripts test",
},참고
