안녕하세요
이직한 회사에서 모노레포 구성을 vercel turborepo로 구성되어 있습니다
최근 모노레포 환경의 각 서비스들이 공통으로 api사용할 수 있도록 package를 구성 하였는데요
구성하고 난후, turbo run build --watch 모드 실행시 종속성 순서가 보장되지 않는 문제가 발생하였습니다
문제원인
기존 모노레포 package에는 design & shared만 존재하였습니다
최근에 각 서비스별 공통 API를 사용하기 위해 api이름으로 package를 추가하였습니다
문제는 design패키지에서도 api를 종속되어 있는데요.
하지만 watch모드를 실행한다면 build순서가 보장되지 않아 에러가 발생합니다.
로컬에서는 watch모드를 활성화하여 작업을 해야 했습니다
문제의 핵심
error: design build start -> api build start !!Error
success: api build start -> design build start
팀원에게 해당 문제를 들었을때 문제의 핵심은 build순서가 보장되지 않고
design 패키지가 build가 되려면 api패키지가 build를 마치고 dist폴더가 생성이 되야 했다고 생각을 햇습니다
팀원은 순서 보장을 위해 package.json script에서 setTimeout을 주어 빌드 순서를 정하였습니다.
그렇게 되면 수동으로 정한 settime시간에 의존하게 되고 확실한 순서보장이 어렵다고 판단되었습니다
문제해결
turborepo는 build --watch모드는 모노레포의 빌드 순서를 보장해주지 않지만
production 배포를 위해 build시에는 종속성 순서를 잘 지켜주어 빌드를 해줍니다.
그렇다면 로컬에서 작업을 할때 watch 모드 실행전에 미리 product build를 하여
빌드된 dist폴더를 만들어두면 추후에 watch모드 실행하더라도 에러가 발생하지 않을 것입니다.
"start": "yarn delete@dist && yarn packages@build && turbo run start
"delete@dist": "rm -rf packages/shared/dist packages/design/dist packages/api/dist",
"packages@build": "turbo run build"
마무리
현재 회사에서 입사한지 얼마 안되었고 온보딩 기간이지만 전 직장에서
모노레포 환경구축 경험이 있고 배포 경험과 build환경에 대해 경험도 있어서
프론트엔드 팀원들도 쉽게 알 수 없는 문제를 할 수 있었고 성과를 내었던거 같다
기존에 모노레포를 담당하던 개발자가 이직를 하게 되어서 모노레포에 대해 잘알고 있지 않았다고 한다.
아무래도 모노레포에 대해 경험이 있고 vite,nextjs 환경도 경험이 있었기 때문에 build,배포환경에 대해 나에게 피드백을 요청할 일이 많아질 거 같다
'개발' 카테고리의 다른 글
Vite(react) production배포시 IE11호환 되지 않는 문제 (0) | 2024.05.28 |
---|---|
[velog 2023-10-24] 모바일 인덱스 UI개편 swipe core컴포넌트 개발 (0) | 2024.05.28 |
[velog 2023-06-23] 아이웨딩 스드메 계산기 개편 후기/회고 (0) | 2024.05.28 |
[velog 2023-06-08] NextJS v13 App Router의 스트리밍SSR (0) | 2024.05.28 |
[velog 2023-05-04] NextJS & ios wkWebview 로컬스토리지 초기화되는 문제 해결 (0) | 2024.05.28 |