NPM & Yarn Dependency model

프로젝트를 할 때 라이브러리를 포함한 외부 패키지를 갖다 쓰는 것은 흔한 일이다. 이미 만들어져있는 코드를 가져다가 사용만 하는 것이기 때문에, 프로젝트가 이 외부 패키지들에게 '의존하고 있다'고 표현해도 될 것이다.

프로젝트가 의존하고 있는 패키지들의 목록이 열거된 파일이 package.json이며, 이 파일의 dependencies 라는 객체에 패키지명과 미니멈 버전들이 나열돼 있다.

Semantic Versioning

예시를 들어보자.

"dependencies": {
  "graphql": "^15.3.0"
}

package.json 파일에 위처럼 써있다면 이 프로젝트는 graphql 패키지에 의존하고 있음을 나타내는 것이다. 그리고 graphql 패키지의 버전은 ^15.3.0 이라고 쓰여있는데, 이 . 으로 구분된 숫자들과 숫자들 앞에 ^ 는 무엇을 의미하는 것일까?

버전을 나타내는 방법으로 semantic versioning 이라는 것이 있다. 줄여서 semver 이라고 부르기도 한다. 이 방식에 따르면 패키지 버전은 3가지 파트로 구분된다.

• major
• minor
• patch

. 으로 구분되며 위의 예시로 설명하자면 메이저 버전이 15, 마이너 버전이 3, 패치 버전이 0 이라는 뜻이다. (major.minor.patch)

메이저 버전을 올리는 것은 비가역적인 업데이트가 있고 그 전의 버전들과 호환이 되지 않을 정도로 큰 업데이트일 때 사용된다.

마이너 버전은 그 전의 버전들과 호환은 가능한 정도의 기능이 추가됐을 때 올라간다. 예를 들어 함수에 옵셔널 아규먼트가 추가된 경우 사용될 수 있다.

패치 버전은 하위 버전들과 호환 가능한 버그 픽스가 있을 때 올라간다. 예를 들어 코너케이스 핸들링이 추가된 경우에 사용될 수 있다.

버전 넘버 앞에 붙은 ^(caret)은 버전의 범위(range)를 나타낸다. 보통 ^ (caret)이나 ~(tilde) 가 많이 쓰이는데 caret은 표기된 버전 넘버에서 마이너, 패치 버전을 올려서 설치를 허용한다는 뜻이다. 위 예시로 보자면 graphql 패키지는 15.3.0에서부터 16.0.0 전 까지의 버전까지 설치가 가능하다.

tilde는 패치 버전만 올려서 설치가 가능하다는 뜻이다. 예시로 보자면 graphql 패키지는 15.3.0에서 15.4.0 전 까지의 버전이 설치 가능하다.

Dependency Model

npm 또는 yarn을 사용할 때 알아두면 좋은 것이 다른 언어들의 패키지 매니저와 다른 점이다. npm, yarn은 하나의 프로젝트 내에서 같은 패키지의 다른 버전 공존을 허용한다. 일반적으로 다른 언어들의 패키지 매니저들은 conflict를 피하기 위해서 하나의 패키지에 대해서는 하나의 버전만을 허용한다. 그러나 npm, yarn은 이 디펜던시들을 isolate 시키고 private하게 만들어서, 같은 패키지에 대해서도 여러 버전이, 하나의 프로젝트 내에서 가능하게 만든다.

이렇게 하면 더 유연하게 패키지를 관리할 수 있지만 단점은 중복돼는 패키지들은 복사해서 갖고 있기 때문에 용량이 매우 커지고, 그에 따라 성능 저하가 있을 수 있다는 점이다.

그리고 더 큰 문제가 생길 수 있는데, 패키지 설치는 문제 없이 되지만 런타임에서 에러가 날 확률이 있다는 점이다. 예를 들어 어떤 패키지 A가 Angular 5에 의존하고 있고 패키지 B가 Angular 6에 의존하고 있다면, 설치 자체는 문제가 없었지만, A와 B가 같은 코드 베이스에서 동시에 실행될 때 의존하고 있는 앵귤러 버전이 달라서 충돌이 날 수 있다.

npm과 yarn은 이것을 peer dependencies 로 해결한다. peer dependency는 양립 가능한 버전을 나타낸다. 즉 package.json에 peerDependencies라는 객체를 정의하고 안에 패키지명과 버전넘버를 적으면, 해당 패키지가 설치되는 쪽에서 이 버전이 깔려 있지 않거나 다른 버전이 이미 설치돼있으면 warning을 보여줌으로써 충돌을 방지할 수 있게 해준다.

Types of dependencies

• dependencies: 코드를 실행하기 위해 필요한 의존성들. e.g. React
• devDependencies : 코드를 실행할 때 사용되지는 않지만 개발 과정에서 필요한 의존성들. e.g. Babel
• peerDependencies: 버전 충돌을 피하기 위해 필요한 패키지 버전을 명시한다.

Ref

• https://lexi-lambda.github.io/blog/2016/08/24/understanding-the-npm-dependency-model/
• npm dependency model이 다른 언어들의 패키지 매니저와 다른 점(중복 허용)을 설명한다
• https://medium.com/angular-in-depth/npm-peer-dependencies-f843f3ac4e7f
• npm이 패키지 버전 충돌을 어떻게 해결하는지 보여준다. 결론은 peer dependency.
• https://classic.yarnpkg.com/blog/2018/04/18/dependencies-done-right/
• yarn은 패키지 버전 충돌을 어떻게 해결하는지 보여준다. 결론은 peer dependency이고 npm과 비슷함.
• https://classic.yarnpkg.com/en/docs/selective-version-resolutions
• resolutions 필드를 통해서 하위 디펜던시 버전을 고정하는 방법을 알려줌.
• https://medium.com/learnwithrahul/understanding-npm-dependency-resolution-84a24180901b
• npm 패키지 설치가 순서에 따라 어떻게 되는지 시각적으로 잘 그려놓음