지나가던 개발(zigae)

yarn berry(yarn2) 마이그레이션 방법

2021년 7월 13일 • ☕️ 2 min read

yarn-berry, yarn2 는 무엇일까?

Yarn Berry는 새로운 패키지 관리 시스템으로, 기존의 npm, yarn v1 의 패키지 비효율적인 매니징 방법을 개선한 것이다.

Yarn Berry는 고전 패키지 매니저의 문제를 Plug’n’Play 방법을 채택하여 해결하고 하고 있다. 여기서 Plug’n’Playnode_modules를 제거하고 대신 .pnp.js파일을 사용합니다. .pnp.js파일은 프로젝트에 설치된 모든 패키지를 yarn이 디스크에서 배치한 위치에 한다. 따라서 디스크에 자주 쓰지 않아도 되므로 보다 빠르고 안정적으로 설치할 수 있다.

yarn-berry 마이그레이션

첫 번째로 최신 yarn을 받고 프로젝트의 루트로 이동하여 yarn-berry 버전으로 세팅해주면 되고, 방법은 아래와 같다.

$ npm install -g yarn
$ cd ../path/to/some-package
$ yarn set version berry

node_modules가 삭제되고, .pnp.js 파일이 추가 된 것을 확인 할 수 있다. 자세한 내용은 참고

Zero Install 환경

Zero Install 이란? 외부 패키지들을 원격 레파지토리에 올려놓고 프로젝트를 클론 받았을 때 Install 받을 게 없는(?) 프로젝트로 만들 수 있다. 필자 역시 Zero Install 환경을 구축하였는데 속도를 비교 하자면 약 5분 정도 걸렸던 npm install을 통한 패키지 설치 과정이 yarn-berryzero-install 환경은 5~10초 정도 걸렸다.

방법은 간단하다 .gitignore에 아래와 같이 내용을 추가해 준 후 origin 에 푸쉬 해주면 된다.

.yarn/*
!.yarn/cache
!.yarn/patches
!.yarn/plugins
!.yarn/releases
!.yarn/sdks
!.yarn/versions

여기서 Non Zero Install 환경도 궁금할 수 있는데 아래와 같다.

.yarn/*
!.yarn/patches
!.yarn/releases
!.yarn/plugins
!.yarn/sdks
!.yarn/versions
.pnp.*

이슈

yarn-berry 마이그레이션 이후 vscode에서 Cannot find module 'react'처럼 모든 서드파티앱을 찾지 못하는 에러가 발생해서 타입 추론도 안되고 급기야 prettier도 동작을 하지 않았다.(이유 모름)

image

해결 과정

아직 자료들이 많지 않아 공식문서에 의존해야 했는데 yarn 공식문서가 그리 친절하진 않은 거 같다. 필자가 못 찾은 것인지 찾는데 꽤 오랜 시간이 걸렸다. 여기를 참고하면 문제를 해결할 수 있다.

필자와 같이 vscode를 사용하고 있다면 아래와 같이 실행해 주면 해결된다.

$ yarn add -D @yarnpkg/pnpify
$ yarn pnpify --sdk vscode