ZeroCho Blog

안녕하세요. 이번 시간에는 잠시 시간을 내어 package.json에 대해 알아보겠습니다.

npm에서 핵심적인 역할을 하는 게 package.json이라고 했습니다. 패키지에 관한 정보와 의존중인 버전에 관한 정보를 담고 있습니다. package.json의 속성들이 어떤 역할을 하는지 알아봅시다.

{
  "name": "zerocho-blog",
  "version": "2.8.1",
  "description": "blog of ZeroCho",
  "private": true,
  "keywords": ["zerocho", "blog"],
  "homepage": "https://www.zerocho.com",
  "bugs": {
    "url": "www.zerocho.com",
    "email": "zerocho@zerocho.com"
  },
  "license": "MIT",
  "author": "Zero Cho <zerocho@zerocho.com> (https://www.zerocho.com)",
  "repository": {
    "type": "git",
    "url": "https://github.com/zerocho/zerocho"
  },
  "main": "server/index.js",
  "scripts": {
    "start": "node server/index.js",
    "preinstall": "rimraf node_modules"
  }
  "engines": {
    "node": "7.x",
    "npm": "3.x"
  },
  "dependencies": {...},
  "devDependencies": {...}
}

제 홈페이지의 package.json입니다. name과 version이 있죠. 필수로 입력해야하는 부분입니다. 중요한 것은 버전은 아무렇게나 붙이는 게 아닙니다. 규칙이 있습니다. 밑의 버전 부분을 참고하세요.

description과 keywords는 각각 설명과 키워드를 알려주는데요. 사람들이 검색할 때 쉽게 찾을 수 있습니다. private는 이 패키지를 비공개할건지 여부를 알려줍니다. 저는 true라서 여러분은 제 패키지를 볼 수 없습니다. bugs는 버그가 발생할 시 제보할 곳을, author은 제작자의 정보를, repository는 이 코드가 저장되어있는 곳의 정보를 알려줍니다.

main은 이 패키지의 메인 파일이 뭔지를 알려주고, scripts는 여러가지 npm 명령어를 알려줍니다. npm start 하면 node server/index.js라는 명령어가 실행되고, preinstall은 누군가가 이 패키지를 install했을 때 설치하기 전에 하는 행동을 말합니다. 비슷한 것으로 postinstall(설치한 후의 동작)이 있습니다. publish, uninstall, start, restart, test, version 등이 있습니다. 모두 pre나 post를 붙일 수 있습니다. 임의로 자기가 script를 만들어도 됩니다. scripts에 build라는 명령어를 만들었으면 npm run build하면 해당 명령어가 실행됩니다.

engines, os, cpu는 제 파일에는 넣지 않았지만, 이 패키지가 특정한 환경에만 동작하도록 하는 속성입니다.

dependencies, devDependencies, peerDependencies

프로젝트를 진행하면서 여러가지 패키지들을 사용(의존)하게 되는데요. 패키지들의 버전이 빠르게 변하다보니 관리하기가 힘든 경우가 많습니다. package.json은 의존중인 패키지들의 버전을 기록해줍니다. 세 가지 종류로 기록을 해 주는데 바로 dependencies, devDependencies, peerDependencies입니다.

dependencies는 일반적인 경우 의존하고 있다는 것을 알려주는 곳이고, devDependencies는 개발 모드일 때만 의존하고 있다는 것을 알려주는 겁니다. devDependencies는 실제로 배포할 때는 필요없는 테스트 도구나 웹팩, 바벨같은 것들을 넣어두면 됩니다.

peerDependencies가 문젠데요. 직접 require은 하지 않지만 호환되는 패키지의 목록입니다. 주로 자기가 어떤 패키지의 플러그인 같은 개발할 때 사용합니다. 제가 만든 react-vote, react-filepicker같은 것은 모두 peerDependencies로 react@15.3.x를 두고 있습니다.

버전

{
  "dependencies": {
    "express": "4.14.0",
    "fb": "^1.1.1",
    "cors": ">2.5.1 <=2.8.1",
    "mongoose": "~4.6.6",
    "morgan": "1.x",
    "nodemon": "latest"
  }
}

버전은 조금 헷갈리는 요소입니다. [메이저].[마이너].[패치] 이렇게 3단계로 구성되는데요.(메이저가 0일 때는 0.[메이저].[마이너] 또는 0.0.[메이저]입니다) 메이저는 대규모 업데이트(이전 버전과 호환 안 됨), 마이너는 소규모 업데이트(이전 버전과 호환은 됨), 패치는 버그 수정 시에 버전을 올립니다. npm에서 특정 버전을 설치하고 싶다면 npm install [패키지명]@버전하면 됩니다.

위의 예시를 보시면 버전 앞에 저마다 다른 기호가 붙어있습니다. 그냥 숫자도 있고, ^, ~, 부등호, x, latest 등이 있네요. 그냥 숫자는 무조건 그 버전을 설치해야하는 겁니다. 부등호(>, >=, <=, <)는 해당 부등호에 일치하면 되고요. x 표시는 어떤 숫자든지 괜찮다는 소리입니다. latest는 가장 최신 버전을 설치하라는 거고요.

^과 ~이 조금 헷갈립니다. ~는 패치버전까지 변경을 허용하고, ^는 마이너버전까지 변경을 허용합니다. 예를 들어봅시다. ~1.3.2가 있으면 1.3.8은 허용하지만 1.4.0은 허용하지 않습니다. ^1.3.2가 잇으면 1.4.5는 허용하지만, 2.0.0은 허용하지 않습니다. ^이 조금 더 여유로운 개념입니다. npm은 ^을 기본값으로 두고 있습니다.

package.json에 대해 자세하게 알고싶으시면 공식 문서를 참조하세요. 다음 시간에는 npm 명령어에 대해 알아보겠습니다.