yarn2 ( yarn berry )와 함께 PnP(Plug'n'Play)를 적용해보기 고통스러운 node_modules 탈출 하기

yarn2 적용 하기

1. yarn 설치

$ npm install -g yarn

기존에 npm을 사용하는 경우에만 설치

2. yarn 버전 설정

$ yarn set version berry
$ yarn -v

yarn set version berry : yarn2의 별칭이 berry입니다. yarn의 버전을 berry로 정합니다.
yarn -v를 통해서 현재 yarn의 버전을 확인 할 수 있습니다.

$ yarn set version 3.2.3

위처럼 특정 버전을 선택할수 있습니다.

3. yarn 설정 방법

기존 npm 사용의 경우
.npmrc -> .yarnrc.yml
package.lock.json 파일 삭제
package.json 파일에 작성된 eslintConfig는 더 이상 사용되지 않습니다.
.eslintrc.json 파일로 빼주세요.

pnp 방식 사용 하기

nodeLinker: "node-modules"

.yarnrc.yml에 위 내용을 추가 하면 기존처럼 node_modules 를 기반으로 동작 합니다.

nodeLinker: "pnp"

pnp로 추가 하면 pnp방식으로 동작합니다.

pnp 모드로 사용할 경우 기존 node_modules 폴더를 삭제 해줍니다.

https://yarnpkg.com/configuration/yarnrc#nodeLinker

4. yarn 설치

$ yarn install
# 또는
$ yarn

5. .gitignore

.gitignore에 아래 내용을 추가 해주세요

Zero-Install을 한다면?

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

Zero-Install을 사용하지 않겠다면?

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

몇 가지 유의사항

1. Node를 실행시킬 때, 기존의 node로 스크립트를 시작하는 것이 아닌, yarn node로 스크립트를 실행시켜야 합니다.
2. 만약 styled-components 패키지를 사용하고 계시다면 추가적으로 react-is 패키지를 설치해야만 정상적으로 작동하는 이슈가 있습니다.