BackEnd Skils

백엔드 입문 (3) - npm 과 yarn 패키지

JellyApple 2024. 12. 1. 01:03

1. npm(node package manager)
: 자바스크립트용 패키지 매니저.
: 유저가 만든 패키지를 등록하는 저장소를 의미하기도 하지만 CLI를 의미하기도 한다. 
: node.js를 설치할 때 함께 설치된다.

 

2. 패키지 매니저 
: 프로젝트에 필요한 의존성 패키지를 관리하는 프로그램을 의미한다.
: 의존성 패키지란 해당 프로젝트를 실행하는 데 꼭 필요한 라이브러리와 모듈을 의미한다.

 

3. 패키지와 모듈
: Node.js에서 패키지는 package.json으로 정의한 파일 또는 디렉토리를 의미한다.
: 패키지에는 package.json이 꼭 포함된다. 
: 결론적으로 package.json으로 정의한 코드 뭉치가 바로 패키지라고 할 수 있다.

: 모듈은 node_modules 디렉토리 아래에 있는 파일 또는 디렉토리를 말한다.
: node_modules 안에 있는 파일이나 디렉토리는 require() 함수로 불러올 수 있다.

: node_modules에는 npm install로 설치한 패키지들이 저장된다. 

 

* CommonJS
 - 브라우저 뿐 아니라 서버 애플리케이션에서도 모듈 기능을 제공하기 위해 나온 모듈 규약이다.

 - Node.js 기본값 , CommonJS 는 require() , ES Module는 import로 임포트한다.

 - ESM(ES Modules)를 사용하면 프론트엔드 코드를 백엔드에서도 쉽게 가져갈 수 있는 장점이 있다.

 

4. packagejson 
: npm init -y으로 package.json을 만들거나 수작업으로 만든다.

{
  "name": "package-example",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
      "test": "echo \"Error: no test specified\" && exit1"
  },
  "keywords" : [],
  "author": "",
  "license" : "ISC"
}

 

* package.json의 구성 요소

1) name: 필수로 들어가야하며 , 패키지명을 의미한다. 214 글자 제한이 있고 밑줄 또는 점으로 시작할 수 없다. 또한 대문자도 허용하지 않는 특징이 있다.

2) version : 필수로 들어가야 하며, 패키지의 버전을 의미한다. 버전 정보는 node-semver로 파싱이 가능해야 한다.

3) description : 패키지 설명으로 npm search로 패키지 검색 시 나오는 설명문이다.

4) keywords : npm search로 패키지를 찾을 때 도움을 준다.

5) homepage : 프로젝트 홈페이지의 URL이다.

6) bugs : 버그를 제보할 이슈 트래커나 이메일 주소를 적는다.

7) license : 라이센스 정보를 적는다.

8) author, contributors: 저자나 기여자 정보

9) files: 패키지를 설치 할 떄 의존성으로 포함할 파일 리스트, 하나씩 직접 지정할 수도, "*.*" 같은 패턴으로 넣을 수도 있다.

10) main : 모듈을 프로그램에서 가져다 사용하는 경우 진입점이 되는 파일이다. 주로 index.js나 main.js를 사용한다.

11) bin : 패키지에 실행 파일이 있는 경우 여기에 지정함. npx 명령어를 사용 시 실행된다.

12) scripts: npm start, test 등의 npm으로 실행하는 스크립트 정보를 설정한다. npm run <스크립트>로 실행 가능하다.

13) config : 패키지의 스크립트에서 사용할 환경 변수를 설정할 수 있다.

14) dependencies: 의존성 패키지명과 버전을 맵 형태로 관리한다.

15) devDependencies : 테스트 시 필요한 의존성 패키지명과 버전을 맵의 형태로 관리한다.

16) peerDependecies: 다른 패키지에서 직접 require로 불러오는 것은 아니지만, 필요한 패키지를 만들어야 하는 경우 사용한다. 주로 플러그인의 호환성 정보를 나타내는데 사용함

17) optionalDependencies: 사용을 원하는 패키지이지만, 없거나 설치가 실패해도 npm 설치가 중단되지 않는 것들을 의미함.

18) engines : 동작 가능한 node 버전 지정

19) os : 어떤 운영체제에서 동작하는지 지정

20) private: true로 설정 시 publish 명령을 거부함.

 

* 시맨틱 버전 : <메이저>.<마이너>.<패치>로 이루어진 구조, Node.js 패키지들은 시맨틱 버전을 따른다.

 

5. npm install 

: npm i , npm add를 사용할 수도 있다.

// npm 패키지 예시
[<@scopes>/]<name>@<tag/version/version range>

 

: 패키지 스코프 (<@scopes>) = 일종의 네임 스페이스 가장 유명한 것으로는 @types 가 있다.(타입스크립트 정의 패키지)

: 패키지명(<name>) 

: -D , -save--dev = devDependencies에 의존성 설정 추가

: -P , --save-prod = dependencies에 의존성 설정 추가. 기본값 보통은 사용하지 않음

: -g , --global = 프로젝트 디렉터리가 아닌 node가 설치되어 있는 디렉터리의 [node_modules]에 의존성 패키지 설치

 

6. 패키지 업데이트 

: npm up , npm upgrade 사용

 

7. 패키지 삭제

: npm uninstall 

 

8. 스크립트 기능과 NPX 

: npm은 명령어를 지정해 실행하는 스크립트 기능을 제공한다.

: 스크립트 기능은 중지, 빌드 ,배포 ,테스트 ,시작 등을 터미널로 입력하지 않고 package.json에 정의하는 것이다.

"scripts" : {
   "hello" : "echo 'hello your world node.js" // npm run hello
 }

 

: npx는 Node Package eXecute의 약자. Node 패키지 실행자라고도 한다. npx를 사용하면 node_modules 경로 없이 생략 가능하게 패키지를 설치할 수 있다.

 

9. package-lock.json (패키지 잠금)

: package.json에 버전을 설정 할 떄 특정 버전이 아니라 버전 범위를 설정하면 패키지를 설치하는 시점에 따라 다른 버전이 설치되는 문제가 생긴다. 

: npm5 이후 부터는 패키지를 처음 설치 혹은업데이트 하는 시점과 똑같은 버전을 설치하도록 package-lock.json에 패키지의 의존성 트리 정보를 저장해두고 설치 시 package-lock.json을 확인하고 설치한다. 이를 패키지 잠금이라고 한다.

 

* npm ci = package.json을 변경하는 npm install과 달리 package.json과 package-lock.json 버전이 일치하는지 확인 함, 또한 node_modules 삭제 후 재설치를 진행 한다.

 

10. npm의 대안 yarn

: 용량 문제 , 패키지 내려받기 속도 문제, 보안 문제 등이 있는 npm의 대안이다.

: 2016년 페이스북이 만든 패키지 관리 프로그램이다.

: yarn은 버전 1과 yarn berry라고 부르는 버전2가 있다.

: 버전2는 PnP 전략을 사용해 node_modules 없이 의존성 패키지를 관리 한다. 즉, 의존성 찾기는 .pnp.cjs에 정리하고 실제 의존성 패키지 파일은 압축 파일의 형태로 .yarn 디렉토리 아래의 cache 디렉토리의 저장한다. 이 때 cache 디렉토리는 트리 구조가 아닌 평평한 구조이다. (적절한 곳에 꽂으면 바로 실행하도록 단순화하는 PnP 전략 때문)

: 이렇게 하면 추후 서버 배포 시 패키지 설치를 하지 않아도 된다. (= 제로 설치)

 

11. npm과 yarn 명령어 비교

명령어 npm yarn
의존성 설치 npm install yarn
패키지 설치 npm install <패키지명> yarn add <패키지명>
개발용 패키지 설치  npm install --save-dev <패키지명> yarn add -dev <패키지명>
패키지 삭제 npm unintall <패키지명> yarn remove <패키지명>
스크립트 실행 npm run yarn run
프로젝트 초기화 npm init yarn init

 

12. 결론

: yarn2를 사용해보는 것을 추천한다. 나는 npm만 주로 사용했기에 yarn 또는 pnpm은 익숙하지 않은데 추후 사이드 프로젝트를 진행 할 시 yarn을 사용해봐야함을 느꼈다.