npm과 yarn에 대해 알아보자

naring·2023년 3월 7일
0

들어가며 …

무지성으로 사용하던 npm과 yarn이 정확히 무엇이고 둘의 차이가 무엇인지 알아보자!

node package manager ⁉️


package

A package in Node.js contains all the files you need for a module.

Modules are JavaScript libraries you can include in your project.

일단 패키지가 뭐냐 …

패키지는 모듈에 필요한 모든 필요한 파일 묶음이라고 생각하면 된다. 쉽게 말해서 하나의 모듈을 구성하는 코드 집합이다. 이 패키지 단위를 통해 코드가 공유된다.

패키지는 다음 3가지 정보를 가지고 있다.

  1. 컴파일한 소프트웨어의 바이너리(binary)
  2. 환경 설정(configuration)에 관련된 정보
  3. 의존(dependency)에 관련된 정보

Package manager

패키지 매니저란 패키지를 다루는 작업(패키지 설치, 업데이트, 수정, 삭제)을 편리하고 안전하게 수행하기 위해 사용되는 툴이다.

패키지 매니저는 운영체제에서 등장한 개념이다. 전통적으로 리눅스와 같이 unix 계열의 운영체제에서 프로그램을 설치할 때, 오픈소스 프로그램이 대다수였기 때문에 소스코드를 다운받고 해당 컴퓨터 환경에 맞춰 컴파일 과정이 필요했다. 이 과정에서 다른 프로그램에 의존성(dependency)을 갖는 경우가 많아서 이를 해결해야 했는데, 그 해결 방법으로 등장한 것이 패키지 매니저였다.

의존성

기존 패키지를 제대로 동작시키기 위해 필요한 다른 패키지를 'dependency'라고 말한다. 따라서 패키지를 사용하고자 할 때 dependency에 해당되는 다른 패키지들을 전부 설치해줄 필요가 있다.

하지만 그런 새로운 패키지(dependency)들을 설치하는 도중 이번엔 설치하고 있는 패키지의 dependency를 설치해야 하는 상황이 발생할 수 있다.

즉, dependency의 dependency를 설치하는 경우가 생기며, 이런 상황이 끊임없이 이어질 경우 사용자가 수동으로 패키지를 관리하기가 불가능에 가까워진다. 이런 상황을 dependency hell이라고 한다.

따라서 각각의 패키지가 자신의 dependency에 대한 정보를 가지게 한다면, 사용자가 사용하고자 하는 패키지의 dependency를 패키지 매니저를 통해 쉽게 설치하도록 도울 수 있다.

package manager의 역할

  • 메타데이터 처리 및 쓰기
  • 모든 의존성을 일괄(Batch) 설치 또는 업데이트
  • 의존성 추가, 업데이트 및 제거
  • 스크립트 실행
  • 패키지 배포(publish)
  • 보안 감사(audit) 수행

node package manager

마찬가지로 js에서도 그러한 패키지 매니저가 필요했다. 그 첫 번째로 등장한 것이 npm이 되겠다. npm이 등장하기 전까지 프로젝트 의존성을 수동으로 다운로드하고 관리해야 했다. 메타데이터 필드가 포함된 package.json, node_modules에 의한 의존성 저장, 사용자 지정 스크립트 등은 모두 npm에 의해 도입되었다.

npm이란


npm은 자바스크립트 언어를 위한 패키지 매니저다. npm이 node package manager의 약자로 알고 있지만, 공식 깃허브 리드미를 보면 그렇지 않다. 이는 bash의 pm(pkg make inst의 약자)을 따왔다고 한다. 이 함수는 다양한 것들을 다양한 플랫폼에서 사용할 수 있도록 하는 함수(package manager의 태초 정도…)다. 따라서 node pm이나 new pm의 약자로 보는게 맞다고 적혀있다.

각설하고 .. npm의 구성을 살펴보면, npm은 3개의 구성요소를 갖는다.

  • 웹사이트
  • CLI
  • 저장소(registry)

웹사이트는 패키지를 찾기, 프로필 설정 등과 같이 다른 npm과 관련한 것들을 관리하는 데에 사용한다.

CLI는 많은 개발자들이 npm과 상호작용하는 방식이다.

저장소(registry)는 public 데이터베이스로 자바스크립트 소프트웨어와 메타데이터 정보에 대한 저장소이다.

역할

결국 npm은 node 모듈을 웹에서 받아서 설치하고 관리하게 해 주는 프로그램이다. 또한 그 모듈을 만들어서 공유할 수도 있고, 필요한 것을 찾아서 사용할 수도 있다.

yarn이란


Yarn is a package manager that doubles down as project manager. Whether you work on one-shot projects or large monorepos, as a hobbyist or an enterprise user, we've got you covered.

yarn은 프로젝트 관리자의 역할도 하는 패키지 관리자이다. (공식문서) npm과 같은 자바스크립트 패키지 매니저이다.

이는 2016년 페이스북에서 개발한 패키지 관리자로, 당시 npm이 가지고 있던 일관성, 보안 및 성능 문제 등을 해결한 새로운 패키지 매니저를 개발하기 위해 만들었다. Yet Another Resource Negotiator를 의미하는 yarn으로 이름지었다.

npm과 yarn의 비교


프로젝트 구조

npm과 yarn 모두 프로젝트 디렉토리 최상단에 있는 package.json 파일을 제공한다. 이 파일은 프로젝트와 관련된 모든 메타데이터를 보관한다. 프로젝트의 의존성 버전, 스크립트 관리에 용이하다.

또한 npm과 yarn 모두 node_modules 폴더에 의존성 파일을 보관한다. (yarn 2에서는 제공되지 않는다.)

또한 프로젝트에 사용되는 의존성의 정확한 버전이 선언된 lock file을 제공하는데, 이를 npm에서는 package-lock.json이라 하고, yarn에서는 yarn.lock이라 한다. package.json에 나타나져 있는 의존성은 semver 표기법으로 나타나있는데, 이는 범위를 지정하는 방식이다. 따라서 문제가 생기지 않도록 lock 파일로 패키지의 정확한 버전정보를 추적한다.

그리고 각각은 추가로 .npmrc 설정 파일, .yarnrc 설정 파일을 선택적으로 설정할 수 있다. yarn classic은 .npmrc도 호환된다.

속도

npm은 패키지 설치 프로세스가 하나씩 순차적으로 진행되는 반면, yarn은 여러 패키지를 동시에 가져오고 설치하는 병렬 처리가 가능하다. 따라서 yarn이 npm보다 속도가 빨랐다. 하지만 npm 5.0 이후에는 그차이가 매우 근소해졌다.

보안

npm은 자동으로 패키지에 포함된 다른 패키지들이 즉시 포함되도록 한다. 이로 인해 보안 시스템에 취약점이 발생하게 된다. 하지만 yarn은 yarn.lock 또는 package.json에 있는 파일만을 설치한다.

하지만 최근 npm의 보안 기능도 크게 향상되었다고 한다. 최신 버전에서는 package-lock.json에서 SHA-512 알고리즘을 확인하여 설치하고자 하는 패키지의 무결성을 확인한다.

💡 npm 5.7.0에서 파일시스템 권한을 바꿀 수 있는 버그가 발견된 적도 있다고 한다. `sudo npm` 을 사용하면 시스템 파일의 소유권을 변경하게 되어 os를 사용할 수 없게 된 적이 있다.

더 알아볼 내용

  • pnpm
  • 새롭지 않은데 새로운 ... the new “yarn”, yarn berry의 등장

https://toss.tech/article/node-modules-and-yarn-berry

  • CommonJS & AMD

참고

package ?

https://www.w3schools.com/nodejs/nodejs_npm.asp

yarnpkg.com/getting-started

package manager?

https://devopedia.org/package-manager

npm vs yarn 비교

https://doppelmutzi.github.io/packageManagers/https://dev-boku.tistory.com/entry/번역-JavaScript-패키지-매니저-비교-npm-Yarn-또는-pnpm

https://velog.io/@gouz7514/프론트엔드번역-npm-vs-yarn

https://seogeurim.tistory.com/12

profile
개발은 즐거워

0개의 댓글