[node] package.json

새로운 프로젝트에 참여하게 됐다.

깃 초기화부터 npm 프로젝트 생성까지 하나하나 직접 만들어야한다.

 

npm init으로 package.json 을 생성하니

{
  "name": "mobile-server",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

이렇게 허전한 package.json이 만들어졌다.

 

기존 프로젝트들을 보니 browserlists, engines, eslintconfig, resolutions, keywords 등등 많은 키들이 있었다. 어떤거를 넣어야 할지 어떤거를 빼야할지 기준이 서지않아서 이참에 하나하나 알아가보기로 했다. 알아가기 전에 앞서 npm을 먼저 간단하게 정의 해봤다.

 

npm?

Node Package Manager의 줄임말로 node.js를 위한 패키지 매니저이자, node.js를 위한 오픈소스 생태계이다. npm은 node.js에서 사용하는 모듈들을 패키지로 만들어 관리 및 배포하고있다. 이 때 이 패키지들이 서로 의존되어있어 하나의 문제가 발생 시 다른 것들까지 기능하지 않을 수 있다. 그래서 이를 관리하기위해 package.json이 필요하다.

 

 package.json? 

프로젝트의 루트 디렉터리에 있는 JSON파일로서, 프로젝트에 대한 중요한 정보들이 들어있다. 패키지이름, 버전, 설명, 진입파일,(main) 저자 등을 명명 할 수 있다.

 

 

 구성요소

"name": "my-project"

name

- 패키지의 이름을 정의합니다.

- 이름은 214자 이하, 소문자만 가능하며 URL에 사용가능한 하이픈과 밑줄은 허용가능하지만 그 외 기타 문자는 허용되지 않음.

 

 

 

"version": "1.5.0",

version

- semantic versioning; 시멘틱 버전 관리.

- SemVer(시멘틱버전관리)를 반드시 사용해야 하는 것은 아니나,Node.js 생태계에서 사용되는 표준이므로 따르는걸 추천한다.

- 배포할 계획이 없을경우 version은 선택사항.

 

 

  "license": "ISC"

license

- package.json이 설명하는 코드에 적용되는 라이선스를 정의할 수 있다. 

 

 

"author": "Inadang <ina9377@gmail.com>",
"contributors": [{
	"name": "nadang",
	"email": "ina9377@gmail.com",
	"url": "https://h-owo-ld.tistory.com"
}],

author / contributors

- 작성자와 기여자. 기여자는 배열 객체 형식으로 되어있다.

 

 

  "description": "티스토리 패키지 제이슨",

description

- NPM 레지스트리에서 검색결과 및 npmjs.com 웹사이트에서 패키지를 설명하는데 사용된다.

- 패키지에 대한 설명을 적어두는 공간.

 

 

  "keywords": [
    "javascript",
    "starter"
  ],

keywords

- 패키지 검색 인덱싱으로 이용되는 문자열 배열.

- NPM레지스트리에 게시하지 않는 경우 이 필드는 많이 사용되지 않으며 자유롭게 생략할 수 있다.

 

 

  "main": "index.js"

main

- 프로젝트의 진입점(entry point)이 되는 모듈의 ID이다. 일반적으로 프로젝트를 시작하는데 사용되는 파일을 정의한다. 

- 예를 들어, 사용자가 foo라는 이름의 패키지를 설치하고, require("foo")를 통해 모듈을 import하면, "main"으로 지정한 module.exports 속성이 반환된다.

 

 

 

  // create-react-app으로 만든 scripts
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

scripts

- 패키지 생명주기에서 다양한 시간에 실행되는 스크립트 명령을 포함하는 dictionary.

- 자주 사용할 명령어들을 alias(별명)를 통해 지정해 둘 수 있다.

 

 

 

 

"repository": {
	"type": "git",
	"url": "https://github.com/Ina-dang"
}

repository

- 저장소 필드를 제공하여 프로젝트 코드가 상주하는 저장소를 기록할 수 있다. 

- 중요 포인트로, url필드는 배포된 코드 베이스뿐 아닌 버전 제어에 엑세스 할 수 있는 위치를 가리켜야 한다.

 

 

 

 

"dependencies": {
	"express": "^4.16.4",
    "compression": "~1.7.4"
}

npm install <노드모듈>
npm install <노드모듈> --save-dev

dependencies / devDependencies 

- package.json내 가장 중요한 필드중 하나이며 위에 말했던 npm관리에 필요한 항목이다.

- 프로젝트에서 사용되는 모든 디펜던시가 여기에 나열된다. npm install 을 사용한다. 

- --save-dev 명령어를 같이 입력하면 devDependencies에 추가된다.

- package.json 은 디펜던시를 기록하는 파일일 뿐 실제 코드는 node_modules/ 에 설치되어 있기 때문에 npm install, npm uninstall, npm update로 관리를 해주어야 반영이 된다.

 

 

 

  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },

browserlist

- 브라우저를 선택하는 옵션기능을 따로 뽑아 놓은 도구

- 브라우저리스트는 '쿼리'라는 문법을 사용해 브라우저를 정의한다.

- .browserslistrc 파일 또는 packages.json파일 내 browserslist키를 사용해 정의한다.

- 입력한 쿼리가 제대로 작동하는지 확인할때는 npx browserslist 명령어를 입력하여 확인한다.

 

 

 

 

  "engines": {
    "node": "= 18.12.1"
  },

engines

- 노드의 버전을 지정한다. 디펜던시와 마찬가지로 버전을 지정하지 않거나 "*"로 지정하면 노드의 모든 버전을 수행할 수 있다.

 

 

이 외에도 eslintConfig, os 등 다양한 package.json 키가 존재한다. 

필요할 때 npm docs를 보면서 만들면 된다.

 

 

참고:

- https://heynode.com/tutorial/what-packagejson/

- https://docs.npmjs.com/cli/v9/configuring-npm/package-json