pnpm

pnpm의 특징

• hard symlink 적용한 Content-addressable storage 방식
  • 특정 버전의 패키지가 한번만 설치되도록 한다.
• 전통적인 node_modules 사용방식이므로 .git/objects 에 지속부하를 주지 않음 (yarn berry는 변경점이 계속 commit 되므로 부하가 발생)
  • 이거는 맞는 말인지 재확인 필요..
  • https://git-scm.com/book/en/v2/Git-Internals-Git-Objects 참고
  • https://engineering.ab180.co/stories/yarn-to-pnpm 참고
• installation 방식 변경으로 속도개선
  • 기존은 resolving, fetching, linking 세 단계가 three-stage installation 되었음
  • 즉, 모든패키지가 같은 단계에 있어야했다. a,b,c 패키지 모두 resolving이 끝나야 fetching으로 넘어감
  • pnpm은 위 세단계가 각 패키지마자 독립적으로 진행이 됨
  • resolving : 의존성 해석단계, package.json에 명시된 패키지들을 기반으로 정확한 버전 결정
  • fetching : 패키지 가져오는 단계, npm registry에서 다운로드하거나 로컬 캐시에서 확인
  • linking : 패키지를 프로젝트의 node_modules 디렉토리에 연결하는 과정, pnpm은 node_modules에 복사하지 않고 심볼릭 링크로 연결한다.

pnpm 테스트

심플하게 React만 설치해본다.

npm init --y
git init

corepack enable pnpm
pnpm install react react-dom

디렉토리 구조에서 보면 node_modules 안에 있는 것들이 심볼링링크로 연결되어있다.

.
├── node_modules
│   ├── react -> .pnpm/react@18.3.1/node_modules/react
│   └── react-dom -> .pnpm/react-dom@18.3.1_react@18.3.1/node_modules/react-dom
├── package.json
├── pnpm-lock.yaml
└── src
    └── App.js

5 directories, 3 files

yarn으로 설치한 경우, node_modules 밑에 내가 package.json에 지정한 패키지 외에도 flat하게 설치된다. (...)은 파일이 여러개가 있음을 표시한것이다.

yarn add react react-dom

.
├── node_modules
│   ├── js-tokens
│   │   └── (...)
│   ├── loose-envify
│   │   └── (...)
│   ├── react
│   │   └── (...)
│   ├── react-dom
│   │   └── (...)
│   └── scheduler
│   │   └── (...)
├── package.json
└── yarn.lock

16 directories, 84 files

npm, yarn 과의 차이점

npm과 yarn은 프로젝트간 패키지 공유가 되지 않는다. 예를 들어 프로젝트 3개에 axios@1.0를 사용중이라면 각 프로젝트 node_modules에 설치되어 총 3번 설치가 된다.

Trouble shooting

1. yarn add react react-dom 시에 발생

Error Message

error This project's package.json defines "packageManager": "yarn@pnpm@9.11.0". However the current global version of Yarn is 1.22.21.

상위 디렉토리에 package.json 이 있었는데 여기에 packageManager가 있었다. 왜 상위의 것에 의해 영향을 받은지는 모르겠으나 이걸 삭제하니 yarn add가 된다.

  "packageManager": "pnpm@9.11.0+sha512.0a203ffaed5a3f63242cd064c8fb5892366c103e328079318f78062f24ea8c9d50bc6a47aa3567cabefd824d170e78fa2745ed1f16b132e16436146b7688f19b"

명시적 설치 필요

yarn classic의 경우 node_modules에 turborepo project들에서 사용하는 모든 패키지가 설치되어있었음. pnpm은 명시적으로 프로젝트상에서 설치를 해줘야한다.

예를들어 기존에 yarn에서는 발생안하던 모듈을 못찾는 에러가 발생했다.

Cannot find module 'uuid' or its corresponding type declarations.

어떤 패키지에서 설치가 되있는지 찾기 위해서 모든 package.json을 검색했다.

cd <root-directory>
rg "uuid" -g "package.json" # search uuid in all package.json