[ 자바스크립트(JavaScript) ] npm install 후 package-lock.json의 diff가 많고 npm run dev가 안될 때

📍npm install 후 package-lock.json의 diff가 많고 npm run dev가 안될 때

내가 담당한 repository를 본격적으로 작업하기 전에, 터미널에 npm install으로 해당 project를 실행하기 위해 필요한 패키지를 설치하는 도중 VSCode의 Source Control - Changes에서 main 브랜치의 package-lock.json의 코드와 다르게 diff가 엄청 많이 생기면서 npm run dev를 실행하면 오류가 뜨면서 정상적으로 local 환경 실행이 안 되는 경우가 있었다.

 

 

main 브랜치의 package-lock.json과 다른것도 없는데 갑자기 diff가 많이 생겨서 당황했지만, 침착을 유지하며 구글링을 한 결과 원인은 npm이 항상 package-lock.json에서 가능한 모든 데이터를 가져오려고 시도하는 특징 때문에 생긴 문제였다. 프로젝트 파일 중 package-lock.json을 잘 들여다보면 3번째 줄에 lockfileVersion이란 코드가 있는데, 이는 document의 체계적인 버전을 나타내는 코드이다.

728x90

lockfileVersion은 npm의 버전에 따라 1과 2로 나뉜다. npm v5 ~ npm v6는 1이 사용되고, npm v7이상은 2가 사용된다. (여담으로 lockfileVersion 버전 3도 있는데, 이는 npm v7이상에서 node_modules/.package-lock.json의 숨겨진 잠금 파일에 사용된다. 만약, 현재 패키지가 npm v6에 대한 지원이 없다면 향후 버전에서 사용될 가능성이 높다.) 결론적으로 문제 원인은 lockfileVersion이 2에서 1로 낮아지면서 생긴 문제인데, 당시 나의 로컬 환경의 npm version은 6.14.7이었고, node version은 14.8.0이었다. (npm 버전을 확인하려면 npm -v를, node의 버전을 확인하려면 node -v를 입력하자.)

 

하지만, 이전까지 나는 npm의 버전을 강제로 낮춘적이 없었었는데 왜 downgrade가 됐는지 곰곰이 생각해보니 legacy 프로젝트를 실행시킬 때 최신 node version 지원이 안되어서 nvm으로 node version을 강제로 낮추었더니 해당 node version에 호환되는 npm version으로 바뀌었기 때문이다. 이후 삽질해보며 알게 된 사실인데 node-version과 호환되는 npm 버전이 있었다. (Reference 2번 참고)

 

이를 해결하기 위해 nodejs.org에 접속하여 node.js에서 제공하는 안정적인 노드 버전인 16.15.1 LTS를 설치하고, 해당 노드버전과 호환되는 npm 버전인 8.11.0을 설치하고나서 npm install을 하니까 package-lock.json의 diff가 없이 정상적으로 실행되었다.

 

터미널 명령어는 nvm ls -remote로 지원되는 노드 버전을 확인하고, nvm install 16.15.1로 해당 노드 버전을 nvm에 설치하고,(nvm이 없다면 설치하는 방법을 구글에 찾아보자.) npm use 16.15.1로 노드 버전을 적용시키고, 마지막 npm install -g npm@8.11.0으로 npm의 버전을 맞춰주었다.

 

이렇게 또 하나의 문제를 해결했다. 혹시라도 나와 같은 문제로 고생하고 있는 다른 분들에게 도움이 되었으면 좋겠다는 생각을 하며 글을 마친다.

 

Reference

1. https://docs.npmjs.com/cli/v8/configuring-npm/package-lock-json
2. https://nodejs.org/ko/download/releases/
3. https://nodejs.org/ko/