웹드루아 - 웹 개발자 드루아

현재 진행 중인 프로젝트를 vercel에 배포한 후 계속 500 에러가 발생했습니다. 임시 데이터로 진행할 때 500에러가 발생하지 않았지만 호출한 데이터를 사용하도록 코드를 변경하면 계속 500 에러가 발생했습니다.

500 에러의 경우 서버에서 발생한 것이기 때문에 페이지 콘솔에서는 아무것도 확인할 수 없었습니다. 이 경우 vercel의 로그를 확인해야합니다. 로그를 확인하고 500 에러를 해결하는 과정을 작성할 예정입니다.

맨 밑에 결론이 있습니다. 어떻게 해결하면 되는지 궁금하신 분은 바로 결론 봐주시면 됩니당 :)

1. Details 접속

생각보다 간단합니다. vercel에 배포한 상태에서 github에 push하고 pr을 진행할 때, 아래 사진과 같이
Details를 확인할 수 있습니다.

클릭하여 Deployment 옆에 있는 Logs를 클릭하여 어떤 오류가 발생했는지 확인하고 해결하면 됩니다.

2. 로그 확인을 통한 에러 발생 원인 파악

⨯ Error: Could not load the "sharp" module using the linux-x64 runtime

이렇게 어디 부분에서 문제가 발생했는지 알 수 있습니다. 필자의 경우는 linux-x64 환경에서 sharp 모듈을 로드할 수 없어 발생한 문제였습니다. 이는 linux-x64 환경에서 모듈을 사용할 수 있도록 

옵션 의존성 설치나 플랫폼을 지정하여 설치해주면 된다고 합니다.

옵션 의존성 설치

먼저 옵션 의존성 설치를 진행한 후 다시 배포하여 오류가 해결되는지 확인해 보겠습니다.

위 명령어를 입력하여 설치한 후 github에 push 했습니다.

해당 오류가 발생했습니다. 사실 이건 이전에도 발생했던 오류입니다. 그 이유는 sharp 라이브러리는 0.33.2 이상 버전부터 vercel 배포 환경에서 오류를 발생시키더라고요. 그렇기에 위에서 옵션 의존성 설치를 진행할 때 버전을 0.33.1 버전으로 설치해줘야합니다. 

다시 설치를 진행하고 배포를 진행해보겠습니다.

설치 후 다시 확인해 봤는데 RangeError는 발생하지 않지만 여전히 같은 에러가 발생했습니다.

플랫폼 지정 설치

설치 후 다시 push 진행했는데도 같은 에러가 발생하네요..ㅠㅠㅠ

해결하기 위해 찾아본 결과 sharp 버전 문제인 것 같아서 버전을 한단계 더 낮춰 옵션 의존성 설치를 진행한 후 다시 배포해보겠습니다.

똑같이 에러가 발생하여 버전을 0.32.6으로 낮추어 다시 배포해 보겠습니다.

한가지 간과한 점이 npm uninstall sharp를 하지 않고 덮어써서 문제가 발생한 것 같습니다. 
uninstall을 진행한 후 0.33.1로 재설치 해보겠습니다.

여전히 같은 에러가 발생하네요..ㅠㅠ 0.32.6으로 버전을 낮춰 다시 배포해 보겠습니다.

결론

sharp 0.32.x 버전으로 다운 그레이드 하자

드디어 해결했습니다! 생각보다 너무 가벼운(?) 해결방법이라 허무했습니다..ㅠㅠ
AWS Lambda 환경에서 0.32.6 이상의 sharp 라이브러리가 작동하지 않는 것 같습니다. 버전을 0.32.6으로 낮추고 실행하니 500 에러가 더이상 발생하지 않습니다. 좀 더 공부하여 버전을 낮추는 해결 방법이 아닌 최신 라이브러리를 사용하더라도 오류를 해결할 수 있는 방법을 찾아보겠습니다 이상입니다. 긴 글 읽어주셔서 감사합니다.