yarn berry 세팅하기

 

 

이전에 왜 기업들은 Yarn Berry를 많이 사용할까? - (1)   라는 글을 썼는데 이번에는 세팅하는 법에대해서 배워봅시다.

 

 

1. yarn berry 세팅

// 1. yarn을 전역으로 다운 받습니다.
$ npm install -g yarn

// 2. 프로젝트 루트로 이동해서 yarn berry버전으로 세팅해주시면 됩니다.
$ yarn set version berry


// 3. yarn으로 패키지들을 다운로드 합니다.
$ yarn install


// 4. yarn typescript 플러그인 설정 (선택)
// 패키지 자체 타입이 포함되어 있지 않은 경우, 
// 해당 패키지를 추가할 때 자동으로 @types/패키지를 종속성에 추가합니다.
$ yarn plugin import typescript
$ yarn add -D typescript
$ yarn install

 

❗️ 이미 npm으로 create next-app을 하셨어도 괜찮습니다 node_module과 package-lock.json만 지워주시고 진행하시면 됩니다.

 

아마 여기까지만 하시면 vscode는 아마 아래처럼 보일 것 입니다. 따라서 추가적인 설정을 해주셔야합니다.

 

1. vscode Extenstion으로 가셔서 `ZipFS` 검색해서 다운을 받으셔야합니다. 

 

ZipFS는 vscode에서 zip 아카이브에서 직접 파일을 읽을 수 있도록 도와줍니다. 

npm을 사용했을 때 node_module에 압축되어있지 않은 상태로 코드가 있기에 바로 참조할 수 있지만 

yarn에서는 패키지들이 압축되어져 있는 상태이기 때문에 vscode에서 참조하기 위해서는 ZipFS가 필요합니다.

 

 

2. sdk를 설치하셔야 합니다.

yarn dlx @yarnpkg/sdks vscode

그럼 아래와 같은 창이 뜹니다. 

   Allow를 눌러주세요!     

❗️ 혹시라도 위와 같은 창이 뜨지 않는다면 아래와 같이 하시면 됩니다.
1) 커맨더 + P를 눌러주세요
2) `>TypeScript: Select TypeScript Version`을 입력해주세요.

 

3) 아래 Use Workspace Version 5.x.x-sdk를 선택해주세요

 

---

2. zero install 설정

 

zero install에 대한 설명은 처음 글 시작할 때 링크되어있는 글에 자세히 설명되어있습니다.     

.gitgnore에 아래 내용을 추가해주시면 됩니다.                           

 

zero install 사용하기

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

 

zero install 사용하지 않기

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