[Angular] package.json
package.json 이란?
package.json은 npm에서 현재 프로젝트의 패키지 버전에 대한 정보를 저장하고 관리하는 파일 입니다. 일반적으로 프로젝트의 루트 디렉토리에 저장하며 애플리케이션 종속성 및 기타 정보를 저장합니다.
npm 명령어를 이용하여 초기화 하고 생성 합니다.
npm init
package name: 패키지 이름 (괄호안의 내용은 미입력하고 엔터 쳤을때 default값)
version: 프로젝트 버전을 입력합니다.
description: 프로젝트 설명을 입력합니다.
entry point: js파일의 실행 시작 지점. 가장 main이 되는 js파일입니다.(모듈이 모이는)
test command: 코드 테스트를 실시할 때 입력할 명령어입니다.
git repository: 코드가 저장된 원격 저장소 주소입니다. 저는 미리 연결을 해두어서 기본값으로 등장했습니다.
keywords: npm에서 패키지를 쉽게 찾을 수 있는 keywords를 적는 공간입니다.
author: 작가, 패키지를 작성한 사람을 적습니다.
license: 패키지의 라이센스를 적습니다.
package.json의 파일 내의 각 정보는 기본적으로 key-value로 저장되는 단일 JSON 객체입니다. JSON을 작성하는 것으로 반드시 모든 key는 쌍따옴표("")로 감싸줘야만 하며 쉼표(,) 기호로 구분을 해줘야합니다.
필수적으로 해당 프로젝트에 관한 name과 version 속성이 명시되어야 하고, 설치되어야 할 패키지들의 목록을 dependencies 또는 devDependencies 속성에 명시할 수 있습니다.
dependencies와 달리 devDependencies의 패키지들은 배포시 굳이 설치가 필요없는, 개발 환경에서만 사용하는 패키지들을 추가하는 곳입니다.
npm init package.json 생성
npm install package-name 패키지 로컬 설치
npm install -g package-name 패키지 전역 설치
npm install –save –dev package-name 패키지 개발 설치
npm install package.json의 모든 패키지 설치
npm uninstall package-name 로컬/개발 패키지 제거
npm uninstall -g package-name 전역 패키지 제거
npm update package-name 패키지 업데이트
npm -v 버전 확인
npm help npm 명령어 설명 참조
패키지 버전 관리
노드에서는 패키지 버전 관리에 SemVer 표기를 따르는데 이것은 0.0.0 세 자리 숫자로 버전을 명시하는 방식입니다.
0.0.0에서 첫 번째 자리는 major, 정식 버전과 하위 호환이 불가능한 기능 변경을 의미합니다. 첫 번째 자리가 0 이라면 정식 출시 이전인 초기 개발 단계를 의미하고 1 이상의 숫자라면 정식 버전을 의미합니다. 하위버전과 호환이 안될 확률이 굉장히 높습니다.
0.0.0에서 두 번째 자리는 minor, 하위 호환이 가능한 기능 변경을 의미합니다. 기능 변경이 생겼으나 하위 버전과 문제없이 호환이 될 때 minor 자리의 숫자를 올립니다.
0.0.0에서 세 번째 자리는 patch, 패치/수정을 의미합니다. 패치는 보통 기능의 추가보다는 기존 기능의 문제점을 수정했을 때 patch 자릿수를 올립니다.
새 버전을 배포한 후에는, 그 버전의 내용을 절대 수정하면 안된다. 만약, 수정 사항이 생기면, major버전, minor 버전, patch버전 중 하나를 의미에 맞게 올려서 새로운 버전으로 배포해야 한다.
^(캐럿): minor 버전까지만 설치 또는 업데이트한다. 예를 들어, npm install express@^1.7.1 이라면, 1.7.1 <= 버전 < 2.0.0까지 설치가 되고, 2.0.0은 설치되지 않는다.
~(틸트): patch 버전까지만 설치 또는 업데이트한다. npm install express@~1.7.1 이라면, 1.7.1 <= 버전 < 1.8.0까지 설치가 된다.
>, <, >=, <=, =: 각 문자가 뜻하는 대로 버전의 초과, 미만, 이상, 이하, current를 의미합니다.
~ 보다 ^가 많이 사용되는 이유는, minor 버전까지는 하위 호환이 되기 때문이다.
npm semver calculator에 방문하면, 패키지 별로 버전 표기법을 사용하여, 업데이터 버전 범위를 확인 가능하다.
node 및 npm 버전 설정
보다 명확한 버전 관리를 위해서 package.json에 node 와 npm의 버전을 설정 해 줄 수 있습니다. 버전 설정은 일반적으로 v1 부터 v2 등의 범위를 지정하여 사용됩니다. 버전 설정을 위해서는 "engines"를 추가하여 사용할 수 있습니다. 이 때 engines 내부에는 "node"와 "npm"을 각각 나누어서 다른 버전을 설정할 수 있습니다. 아래 예제는 node 버전을 v16 이상에서 v17 미만을 사용할 경우 설정하는 방법입니다. 추가로 npm 버전의 경우 v8 이상에서 v9 이하만 설정하도록 선언하였습니다.
@package.json
{
"name": "my-project-name",
"version": "1.0.0",
"engines": {
"node": ">=16.0.0 <17.0.0",
"npm": ">=8.0.0 <9.0.0"
},
"dependencies": {
...
}
}
여기까지 설정이 끝났습니다. 다시 설명하면 위에 설정된 package.json은 아래와 같이 각각 node와 nvm 버전을 설정을 의미하게 됩니다.
- node 버전은 16보다 높거나 같고 17보다 낮다
- npm 버전은 8보다 높거나 같고 9보다 낮다
이처럼 간단하게 package.json에서 버전을 설정하였습니다.
앱을 실행하기 위해서 npm start를 실행했다고 가정했을 때 범위에 벗어난 경우 이를 중단하도록 강제하지는 않는다는 뜻입니다.
그렇기 때문에 package.json에 설정된 버전을 확인할 수 있도록 알려주는 역할을 하게 됩니다.
만약 허용하는 범위의 버전이 아니라면 해당 버전을 직접 설치 하고 실행해야 합니다.
package-lock.json
- npm 버전이 다른 경우
- 새로운 버전의 패키지가 배포된 이후 설치를 진행할 경우
- 패키지가 새로운 버전으로 배포되었을 경우
위와 같은 경우 npm install 수행시 서로 다른 node_modules을 생성 하게 됩니다.
package-lock.json은 node_modules 구조나 package.json이 수정되고 생성될 때 당시의 의존성에 대한 정확하고 구체적인 정보 가지고 자동으로 생성됩니다.
또한 package-lock.json 이 존재할 때에는 npm install 의 동작방식이 package.json 을 사용하여 node_modules를 바로 생성하지않고 package-lock.json 을 사용하여 node-modules 를 생성 하도록 바뀝니다.
협업을 할 때 서로의 버전을 맞추기 위한 기능으로 version range 형태로 작성된 package.json을 명확하게 지정하여 테스트 기능들을 사용할 수 있도록 도와주는 파일입니다.
????? 아래 정리 필요
package-lock.json은 이 package-lock.json이 생성되는 시점의 의존성 트리(node_modules)에 대한 정보를 가지고 있는 파일을 말한다. 의존성 트리는 package.json에 등록된 모듈과 그 모듈들이 의존하고 있는 모듈 전부를 포함하고 있기 때문에, 결국 package-lock.json도 이 모든 모듈들을 가지고 있다. npm을 사용해서 node_modules나 package.json을 수정하게 되면, package-lock.json 또한 자동으로 업데이트가 된다.
package.json 파일에는 의존성 모듈(dependencies)의 version range가 사용된다. version range란, 특정 버전이 아닌, 버전의 범위를 의미한다. 예를 들어, npm install express
로 express를 설치하면, package.json에는 ‘^4.10.3’(Caret Ranges)과 같이 버전 범위가 추가된다. 이 버전의 express가 추가된 package.json을 가지고 npm install
을 실행하면, 현재는 4.10.3 버전이 설치되지만, express의 버전이 업데이트된 상태로 publish가 된 후에, 동일한 package.json 파일로 npm install
을 실행했을 경우, 원래 버전이 아닌, 새로 업데이트된 버전으로 express가 변경된다. 이럴 경우, 기존에 가지고 있던 node_modules(의존성 트리)에 있던 모듈의 버전과 충돌이 일어나, 오류를 발생시킬 수 있다. 이 문제를 해결하기 위해, package-lock.json을 사용하는 것이다.
package-lock.json은 node_modules(의존성 트리)에 대한 정보를 가지고 있는데, package-lock.json이 업데이트가 되는 시점에 node_modules(의존성 트리)을 재생성할 수 있다. 그래서, package-lock.json 파일이 있다면, npm install
로 package.json과 package-lock.json에 있는 모듈이 새로 업데이트되는 동시에, node_modules(의존성 트리)가 새로 생성되어, 각 파일이 가지고 있는 모듈의 버전을 동일하게 맞출 수가 있게 된다.
즉, package.json에 있는 모듈의 버전은 npm install
을 수행하는 시점에 따라 달라진다. 이 말은, npm install
을 수행하는 시점에 publish 되어있는 모듈의 버전으로 업데이트가 된다는 뜻이다. 이렇게 되면, package.json과 package-lock.json에 있는 모듈이 같은 버전으로 업데이트가 되고, 이때 package-lock.json 때문에 node_modules(의존성 트리)가 재생성되어, 3개의 파일에 있는 모듈이 모두 같은 버전으로 맞춰지게 되어 오류가 안나게 된다.
이런 이유로, git에 커밋할 때, package.json 파일 뿐만 아니라, packge-lock.json 파일 또한 같이 커밋을 해야 한다.
`--force` and `--legacy-peer-deps` 차이점
--force로 충돌을 우회하든지 --legacy-peer-deps로 충돌을 무시하든지(npm 4-6버전과 비슷한 방식) 선택하세요.
- --force를 하면 package-lock.json에 몇가지의 다른 의존 버전들을 추가한다.
- --legacy를 하면 peerDependency가 맞지 않아도 일단 설치한다.
일단 --force를 해서 다른 의존버전들을 추가하고 실행해보고 안되면
--legacy를 해서 일단 오류없이 설치한 후 실행해본다.
??? 보다 자세한 내용은 추가 조사 필요
Tips
package.json 에서 ^ 마이너 업데이트를 ~ 패치 업데이트로 바꾸고 npm install을 다시 실행해 본다.
ng version
npm uninstall -g @angular/cli
npm cache clean --force
npm install -g @angular/[email protected]