모노레포가 미리캔버스 프론트엔드 아키텍처를 뒷받침 하는 방법 [2/2]

이 게시물은 미리캔버스 모노레포 프론트엔드가 CI/CD와 플랫폼 아키텍처를 통해 어떻게 동작하는지 설명했습니다. CI는 lint(biome/eslint), type-check(tsc), test(vitest/RTL)를 서로 독립적으로 병렬 실행하여 lint 실패에도 나머지 검증이 계속되도록 구성했습니다. 각 파이프라인의 아티팩트 요구사항을 분리하며 lint는 소스 AST만 분석, type-check는 emitDeclarationOnly로 .d.ts만 생성, test는 번들된 .js가 필요해 의존 관계를 다르게 가져가도록 설계했습니다. CD 통합은 build-time 통합(번들러가 빌드 시점에 패키지를 묶음)과 run-time 통합(Host가 manifest.json을 기반으로 Fragment를 동적으로 로드) 두 방식으로 구분했습니다. run-time 통합에는 Webpack 5 Module Federation을 사용하며 remoteEntry.js 컨테이너, shareScope의 런타임 버전 협상(singleton/requiredVersion)으로 React 인스턴스 중복 문제를 해결합니다. 독립 배포를 위해 Host의 remotes URL 하드코딩 대신 manifest.json 기반 동적 로딩을 사용하고, 플랫폼 팀은 의존성 가시화(fan-in/fan-out)와 CI 병목(캐시 무효화 전파, inputs 정밀 설정) 등을 옵저버빌리티로 관리합니다.