TIL 84 - yarnberry zero install

김영현·2024년 4월 2일

Zero-Install vite yarn yarnberry

TIL

목록 보기

96/129

zero install로 이사가기

부트캠프 마지막 프로젝트를 진행하며 패키지 매니저를 yarn으로 결정했었다.
써보지 않아서 궁금하기도 했고 병렬설치때문에 패키지 설치속도가 npm보다 빠르다하여 사용했었음.

아주 초창기에 멘토님과 얘기하던중 yarn berry를 써보는 게 어떠냐는 제안을 받았다.

당시에 블로그에 적혀있는 글들을 보며 끄덕끄덕 하곤 바로 마이그레이션을 했다.
우왕좌왕 했지만, 공식문서를 보며 어찌저찌 해냄!

...이후 문제가 발생했었다. 그리하여 zero install을 포기한 채 yarn berry를 사용했었다.
한달 반이 지난 지금, zero install에 성공!

한번 뭐가 문제였고 어떻게 하면 되는지 알아보자.

yarnberry와 zero install이 무엇이더냐

공식문서와 여러 문서를 읽으며 찬찬히 알아낸 zero install에 대해 설명해 보겠다.

기존 모듈 탐색 알고리즘(yarn 2<, npm)

Node.js공식문서에 의하면 위와 같다

즉, 필요 없는 경로 탐색을 매번 진행한다. 탐색 자체는 I/O작업이다. 따라서 메모리보다 속도가 현저히 느려 최적화가 어렵다.

유령 의존성

출처yarn 공식문서

왼쪽 종속성 트리를 살펴보면 중복으로 의존하는 패키지가 존재한다. 이를 해결하기위해 hosting, merge를 진행한다.
그러면 탐색 시간을 줄일 수 있다. 다만 반대급부로 존재하지 않는 종속성에 의존하는 코드가 발생할 수 있다.
이를 유령 의존성이라고 한다.

그래서 나온 것이 yarnberry(yarn > 2)와 PnP(Plug in Play)

yarnberry는 호이스팅, 병합하지 않는다.
또한 node_modules를 사용하지도 않는다. 대신 ./yarn폴더 하위에 의존성을 zip포맷으로 저장해놓는다. 이 경로를 탐색하기위한 정보파일인 pnp.cjs도 생성한다.

이를 통하여 유령 의존성 문제와 I/O => 메모리문제를 해결하였다.

zero install

여기서 yarnberry는 멈추지 않고 ./yarn폴더(의존파일) 자체를 커밋에 포함시켜 git에 올려놓는다.
이렇게 되면, 설치를 하지않고도 같은 환경에서 실행할 것 을 보장할 수 있다.

위 내용이 전부고 핵심이다.

zero install시 ./yarn/cache 폴더가 없을 때

우리 프로젝트에서 사용했던 yarn의 버전은 4.1.0이었고 globalCache가 true였다. (다른버전도 true인지 모름ㅎㅎ)
이게 무슨말이냐면, 캐시가 ..사용자계정/appdata/local/yarn/cache폴더(사용자 컴퓨터 로컬 내부...)에 저장되었단 뜻이다.
따라서 한달 반 전에 경로문제가 발생하였던 것이다.

해결법은 간단하다.

# yarnrc.yml

cacheFolder: ./.yarn/cache
enableGlobalCache: false
nodeLinker: pnp

위처럼 globalCache설정을 제거해주고 로컬 캐시를 사용하겠다고 경로를 같이 명시하면 된다.
항상 공식문서를 잘읽어 보자.

아래는 zero install을 도입하며 겪은 트러블 슈팅이다.

Cannot find module or its corresponding type declaration

yarn dlx @yarnpkg/sdks 로 설치해도 발생했음.
yarn dlx @yarnpkg/sdks 로설치한 ts, eslint버전과 현재 프로젝트에 설치된 버전이 달라서 적용이 안되는 에러.
=> typescript버전을 5.3.3 => 5.4.3, type/nodes버전, yarn버전을 업데이트하여 해결

Cache entry required but missing for

CI시 발생한 에러.

로컬 운영체제+CPU아키텍처과 CI환경의 운영체제+CPU 아키텍처가 달라서 생기는 문제.
공식문서에 yarnrc.yml로 옵션 주는 방법이 있음.
참고로 프로젝트 CI환경은 linux+x64다.

# yarnrc.yml

supportedArchitectures:
  {
    os: ['current', 'linux'],
    # 지금 생각해보면 윈도우도 x64아닌가...?
    cpu: ['current', 'x64'], 
    libc: ['current', 'glibc', 'musl'],
  }