프리온보딩 인턴십 동료 학습 중 리팩토링을 위해 공동 원격 저장소에서 로컬 저장소로 pull 받았다. npm install 후 (아무것도 수정하지 않았는데) 변경 사항에 package-lock.json이 떠 있었다. 팀원들과 함께 package를 관리하고 있었기 때문에 변경된 내용을 함부로 저장은 못 하겠고,,😥 변경 사항에 계속 떠 있는 게 거슬리기는 하고,,😶 왜 이런 변경 사항이 생겼는지 너무 궁금했다. 구글링을 통해서 명확히 이해되지 않았었는데, 마침 강의 섹션에서 해당 내용을 학습했다! 😎 복습으로 내용도 정리하고 나와 같은 상황에서 물음표를 던지고 있을 사람을 위해 기록한다.

원티드 프리온보딩 프론트엔드 인턴십 섹션 강의 내용을 바탕으로 작성하였습니다.

npm install 후 package-lock.json 이 왜 수정됐지..? 🤔

npm install은 package.json을 기준으로 package를 설치한다. 그리고 package.json은 범위로 버전이 작성되어 있다. (package-lock.json은 명확한 버전 정보를 담고 있다.) 따라서 해당 범위 내에서 최신화된 버전이 설치되고 package.json은 package-lock.json에 대한 쓰기 권한을 가지고 있어 설치한 버전에 맞게 업데이트한 것이다.

좀 더 자세히 알아보자.

package.json과 package-lock.json의 차이

package.json와 package-lock.json은 이름도 비슷한 만큼 유사하지만, 분명한 차이를 가지고 있다.

설치 기준이 되는 명령어

이 둘은 의존성 package를 설치하는데 기준이 되는 파일임은 동일하다. 하지만 package.json은 npm install 명령어를 실행시켰을 때 의존성을 설치하는 기준이 되고, package-lock.json은 npm ci 명령어를 사용하여 설치할 때 기준이 된다.
그럼, 기준이 되는 파일에 따라 어떻게 설치할까?

버전 표기법의 차이

두 파일은 버전을 표기하는 방법에 차이가 있어 설치되는 버전이 달라질 수 있다.
package.json은 버전 정보를 범위로 작성하고 package-lock.json은 정확한 버전을 작성한다. 따라서 package.json을 기준으로 설치하면 작성된 범위내에서 최신 라이브러리 버전을 설치하고 package-lock.json을 기준으로 설치하면 지정된 버전으로 설치하는 것이다.

// package.json

"devDependencies": {
    "typescript": "^5.1.6"
  }

// package-lock.json

"node_modules/typescript": {
      "version": "5.1.6",
      ...
  }

package.json 파일의 버전 정보에는 앞에 Caret(^)이 붙어있는데 Caret은 npm install을 통해 minor 버전까지 업데이트시킨다. minor 버전까지 업데이트시킨다는 것은, 이전 버전을 호환하면서 몇 가지 기능이 업데이트되거나 버그가 고쳐진 최신의 라이브러리가 설치된다는 의미이다. (아래 버전 표기법 내용 참고)

Semantic versioning 버전 표기법

• major.minor.patch의 형태 (예. 5.1.6)
• major: breaking change를 포함한 변경이 있는 업데이트
• minor: breaking change를 포함하지 않는 변경이 있는 업데이트
• patch: breaking change를 포함하지 않는 버그 픽스 업데이트

A 라이브러리를 처음 설치한 이후에 A 라이브러리의 개발자들이 주요한 버그를 수정하여 버전을 업데이트했다고 하자. 그다음 npm install을 한다면 A 라이브러리의 업데이트된 버전으로 설치될 것이다. 설치한 버전의 정보가 업데이트되었으므로 그것에 맞게 package-lock.json도 수정되면서 변경 사항이 생긴 것이다.

그럼 package-lock.json은 언제 사용할까?

배포를 위해 코드를 병합하고 package를 설치할 때는 npm ci 설치를 권장한다. 작성한 코드는 현재 설치된 버전을 바탕으로 동작하기 때문에 정확한 버전 라이브러리를 설치함으로써 예측하지 못한 문제를 줄일 수 있다.

반대로 항상 정확한 버전을 설치하는 것이 좋지 않을까?

대부분의 경우에는 npm install을 사용하여 설치하는 것이 유익하다. 라이브러리의 주요한 버그가 수정되었을 수도 있고 새로운 기능이 추가되면 사용할 수 있기 때문이다.

정리

• npm install 은 package.json을 기준으로 의존성을 설치한다.
• package.json에는 버전 정보가 범위로 기록되어 있어 범위 내에서 업데이트된 최신 라이브러리를 설치한다.
• 설치된 라이브러리 버전에 따라 package-lock.json 파일의 버전 정보가 수정되어 변경 사항이 발생한 것이다.