문제 상황
모클리는 Next13 기반의 프로젝트이고 CSR, SSR을 활용해 AWS Amplify로 배포된 서비스입니다. Next의 Route groups를 활용하여 라우트를 그룹화하고 구조를 더욱 직관적으로 배치할 수 있었습니다. 하지만 해당 로직을 production 서버에 배포했을 때 Route gruops가 정상적으로 동작하지 않는 문제를 맞이했는데요, 이번 글은 해당 문제를 해결했던 과정을 시간순으로 기록했습니다.
해결 과정
문제
레이아웃을 페이지 단위로 제어하기 위해 Route gruops을 적용했지만 배포 후 정상적으로 동작하지 않는 문제를 발견했습니다.
과정 1. Amplify에서 Next13의 App directory를 미지원하나?
Next13버전에서 App directory는 아직 beta 버전이었기 때문에 아직 Amplify에서 지원하지 않을 수도 있을 것이라고 생각을 했습니다. 그러나 공식 문서에서 지원하는 내용을 확인할 수 있었습니다.
Amplify supports deployment and hosting for server-side rendered (SSR) web apps created using Next.js only. .... You can deploy apps built with Next.js 13 with features such as image optimization and middleware.
과정 2. Next.js의 버전이 문제인가?
앞서 설명드린대로 Next13 버전에서 App directory는 아직 Beta 버전이었습니다. app directory의 stable 버전인 14 버전으로 업데이트 후 테스트해지만 여전히 동작하지 않았습니다.
과정 3. Node.js의 버전이 문제인가?
Amplify-빌드 설정에서 Node.js 버전을 설정했지만 빌드 초반에 아래와 같은 오류가 발생했습니다.
node: /lib64/libm.so.6: version `GLIBC_2.27' not found (required by node)
node18 버전에서 GLIBC_2.27 지원하지 않아 16버전으로 다운그레이드하라는 의견들이 많았습니다. 하지만 next14 버전 부터는node.js의 최소 버전이 18 이상이라 다운그레이드를 진행할 수 없었습니다.
과정 4. AL2 -> AL2023로 변경! (성공)
amplify 기본 빌드 이미지는 AL2였습니다. 해당 링크에서 AL2가 호환성을 제공하는 것은 GLIBC 2.26 버전까지 인 것으로 확인했습니다. 대안으로 Node.js 20버전까지 지원하고 GLIBC를 2.34버전까지 지원하는 AL2023 이미지를 선택하니 배포에 성공했습니다.
결론
Next14의 최소 node.js 버전은 18이상입니다. AWS Amplify 로 배포를 진행할 시 node 18버전 이상부터는 GLIBC_2.27버전 이상을 사용해야하지만 빌드이미지의 기본값인 AL2는 GLIBC_2.26버전 까지 지원합니다. 따라서 node20버전, GLIBC_2.34버전까지 지원하는 AL2023을 선택해야 정상적으로 배포를 진행할 수 있습니다.
'Tech > Moqly (모클리)' 카테고리의 다른 글
| tanstack-query 소스 뜯어보기 (4) | 2024.11.06 |
|---|---|
| Webpack 알아보기 (0) | 2024.07.11 |
| [모클리] Next13 을 선택한 이유 (0) | 2024.02.06 |
| [모클리] Polling으로 채팅 구현하기 (1) | 2024.02.05 |
| [모클리] Sass(SCSS) 사용성 개선하기 (0) | 2024.02.01 |