005_npm ci, npm i

🔥 호락호락하지 않은 프로젝트 설치

 입사하고 나서 이래저래 회사 생활에 적응하던 중, 드디어 우리 팀 프로젝트 설치를 하는 순서가 찾아왔다. 이전까지 yarn이라는 패키지 매니저 위주로 사용하다 오랜만에 npm으로 설치하려는데 선임 분께서 'npm i 대신 npm ci로 설치를 진행해주세요' 라고 요청해주셨다. 그동안 npm i만 알고 있던 내게 또 다른 설치 방법이 있다는게 신기하기도 했고, 구체적으로 어떻게 다른지 확인해보기로 했다.

 

⚡️ npm ci?

우선 npm ci의 'ci' 는 다음 용어의 줄임말이다.

ci : clean install

그냥 설치하는 것도 아니고 클린하게 설치한다는 것은 무슨 뜻일까? 이 뜻을 이해하려면 먼저 package.json과 package-lock.json에 대해 이해할 필요가 있다.

 

우선 package.json은 프로젝트의 정보를 정의하고, 의존하는 패키지 버전 정보를 명시하는 파일이다. 

즉, 내가 설치한 패키지명과 설치할 때의 버전을 적어놓은 파일이다. 이 파일 덕분에 Github에서 프로젝트를 받아 설치된 패키지들을 불러올 수 있는 것이다. 하지만 package.json은 버전 정보를 저장할 때 명확한 버전 대신 version range로 표기한다.

🤔 version range?

👶🏻 : "내가 사용할 패키지의 버전은 3.15.1버전이야"  라고 말하는 대신
👶🏻 : "나는 3.15.1버전 이상, 그리고 3.16.0 미만의 패키지를 사용할거야" 라고 말하는 방식이다.
물론 3.15.1처럼 딱 정해서 명시하는 것도 가능하다.

// version range 예시


// 틸드 (tilde)
"devDependencies": {
  "@vue/cli-service": "~4.3.0",
},

// 4.3.0  이상 4.4.0 미만
// 4.4.0 미만의 패치 레벨 변경을 허용하겠다는 의미


// 캐럿(caret)
"dependencies": {
  "vue": "^2.6.11"
}

// 2.6.11 이상 3.0.0 미만
// 3.0.0 미만의 마이너, 패치 변경을 허용하겠다는 의미

이렇게 명확한 버전이 아닌 범위로써 버전을 명시하게 되면 다음과 같은 문제가 발생할 수 있다.

👶🏻 : 프로젝트 받았는데 왜 작동이 안되지??
👧🏻 : 엥 진짜?? 너 버전이 몇인데?
👶🏻 : 나 3.15.2 !!
👧🏻 : 어.. 나는 3.15.1인데...? 왜 이렇게 설치된거지?

물론 이런 단점만 있는 것은 아니다. package.json에 패키지 버전명을 정확히 명시하게 된다면,
프로젝트에서 사용하고 있는 패키지의 중요한 버그 수정이 이루어질 때 마다 프로젝트의 package.json에 적혀있는 버전도
수정을 해야하기 때문에 모든 크고 작은 패키지들의 릴리즈에 대해 항상 추적하고 수정해야하는 엄청난 귀찮음을
version range로 명시함으로써, 이를 해결해준다는 장점이 있다.

 

하지만 여러 사람이 투입되고 모두가 동일한 환경에서 진행해야하는 프로젝트라면 어쨌든 같은 버전으로 설치할 필요가 있다. 이를 위해 package-lock.json이 필요해진 것이다.

 

package.json 을 읽어 의존성 목록을 만들고
package-lock.json 을 통해 설치할 의존성의 버전을 알려준다.

명확한 패키지의 버전이 적혀있는 package-lock.json을 활용해 설치할 수 있는 것이 드디어 우리가 알아보고자 하는 npm ci인 것이다.

 

npm ci는 다음과 같은 특징이 있다.

 

• package-lock.json 이 무조건 존재해야만 하고, 만약 없으면 에러를 낸다.
• package-lock.json 파일을 기반으로 의존성을 설치하고, package.json 은 버전 매칭 밸리데이션 용도로 사용한다.
  즉, package-lock.json 과 package.json 사이의 버전이 매칭이 안되면 에러를 낸다.
• npm ci 실행하면 먼저 node_modules 삭제한 후, 의존성을 한번에 설치한다.

간단히 정리하자면 node_modules가 있다면 이를 삭제한 후 재설치를 하며,
package.json에 적혀있는 버전과 package-lock.json의 버전을 비교한 다음 매칭된다면
package-lock.json을 기준으로 설치하는 것이다.
그리고 이 둘이 다르다면 버전을 업데이트해서 받는 것이 아닌 에러를 내보낸다.

 

이를 통해 프로젝트에 참여하는 모든 인원이 완전히 동일한 버전으로 프로젝트를 수행할 수 있다.

참고로 yarn에도 이와 비슷한 기능을 제공한다.
yarn install --frozen-lockfile

 

🫵🏻 결론

 프로젝트는 혼자 하는 것이 아니다. 특히 회사의 프로젝트에 참여하거나 팀으로써 사이드 프로젝트에 참여할 때 모두가 한 사람이 프로젝트를 만드는 것처럼 동일한 환경을 최대한 맞출 필요가 있다. 환경의 차이로 인해 프로젝트에 지장이 간다면 이보다 시간이 아까울 수는 없을 것이다. '시작이 반이다' 라는 말이 있듯 초반에 이런 세팅에 조금만 신경쓴다면 앞으로의 개발 라이프에 행복만이 깃들 것이다.

 

 

출처
https://velog.io/@songyouhyun/Package.json%EA%B3%BC-Package-lock.json%EC%9D%98-%EC%B0%A8%EC%9D%B4
https://docs.npmjs.com/cli/v8/commands/npm-ci