[Project] 프로젝트 삽질기20 (feat Node 버전 관리)

들어가며

사이드 프로젝트에서 푸시 알림을 활용한 서비스를 개발하고 있습니다. 개발하는 과정에서, 팀원과 node 버전이 맞지 않아서 개발하는데 어려움을 겪었습니다. node 버전을 프로젝트마다 다르게 설정할 수 있다면 좋겠다고 생각했습니다. 이 글은 개발자 이동욱 님의 nodeenv를 활용한 프로젝트별 node 가상 환경 관리 글, 그리고 Outsider's 님의 npm package.json에서 틸드(~) 대신 캐럿(^) 사용하기 글 참고해서 작성됐습니다.

 

 

 

 

---

 

 

 

 

 

 

 

 

 

 

 

Node 버전 관리

Node.js를 활용해서 개발하려면, npm, yarn, nvm 등의 단어를 살펴볼 수 있습니다.

 

 

npm, npx, yarn?

npm은 라이브러리를 관리하는 관리자로, 자바스크립트로 작성된 오픈소스, 라이브러리를 가져와서 사용할 수 있습니다. package.json에 프로젝트에서 사용하고 있는 모든 라이브러리에 대한 정보가 담깁니다. 라이브러리를 하나라도 추가한다면 프로젝트에 node_modules라는 폴더가 생기고, npm 레포지토리에서 해당 라이브러리의 소스코드를 이 폴더에 저장하게 됩니다. 보통 라이브러리를 설치할 때, 프로젝트에 저장하는데, npx를 활용하면 라이브러리를 저장하지 않고 바로 실행해줍니다. yarn은 npm의 성능과 보안을 개선해서 만든 버전입니다. 

 

npm 패키지 설치

만약 npm을 활용해서 패키지 관리를 한다면, 다음과 같은 내용을 살펴볼 수 있습니다.

 

$ npm install 라이브러리명 # 현재 프로젝트에만 설치
$ npm install 라이브러리명@버전 # 하이브러리의 버전을 지정하여 설치
$ npm i -g 라이브러리명 # 전역 설치

# 개발 모드 설치
$ npm i 패키지명 --save-dev

 

패키지를 설치할 때, 위와 같이 설치하는데, 개발 모드 설치의 경우, 개발할 때만 필요한 패키지를 설치하는 용도입니다. 배포될 필요 없는 패키지는 개발 모드로 설치해야 합니다. 

 

 

 

npm 패키지 정보 확인

만약 설치한 패키지 정보를 확인하고 싶다면 아래와 같이 살펴보면 됩니다.

 

$ npm list # 현재 프로젝트에 설치된 패키지 정보
$ npm ll -g # 전역에 설치된 패키지 정보
$ npm ll -g --dept==0 # 0번째 depth의 패키지 정보만 확인

 

만약 특정 라이브러리 정보를 보고 싶다면 아래와 같이 볼 수 있습니다.

 

$ npm view 라이브러리명

 

 

 

npm 버전 표기법

위에서 간단한 npm, npx, yarn 등을 살펴봤는데, 라이브러리를 설치해서 사용하다 보면, 버전 중에 ^1.0.0과 같이 버전이 적혀있는 것을 종종 볼 수 있습니다. 여기서 숫자 앞에 들어있는 ^는 무엇이며, ~와 ^은 무엇일까요? 

 

 

틸드(~)

npm 문서를 보면, npm을 사용할 때 package.json에서 버전 명시를 다음과 같이 할 수 있습니다. 

 

• 1.2.3
• >1.2.3
• >=1.2.3
• <1.2.3
• <=1.2.3
• ~1.2.3

 여기서 가장 많이 사용하는 방식이 틸드(~)를 이용한 방식입니다. npm install Module --save나 npm install Module --save-dev를 사용하면 자동으로 package.json에 의존성을 추가할 수 있습니다. 이때 기본값으로 사용하는 방법이 틸드(~) 방식입니다. 틸드는 간단히 말하면 현재 지정한 버전의 마지막 자리 내의 범위에서만 자동으로 업데이트합니다. 

 

 

• ~0.0.1 : >=0.0.1 <0.1.0
• ~0.1.1 : >=0.1.1 <0.2.0
• ~0.1 : >=0.1.0 <0.2.0
• ~0 : >=0.0 <1.0

 

그래서 다양한 방식으로 버전을 명시했을 때 위와 같은 범위 내에서 자동으로 업데이트합니다. 

 

 

캐럿(^)

그러면 캐럿은 틸드와 어떤 점이 다른 것일까요? 캐럿을 알아보기 전, Semantic Versioning을 알아볼 필요가 있습니다. npm의 모듈은 모두 SemVer를 따르며, SemVer는 MAJOR.MINOR.PATCH의 버저닝을 따릅니다. 각 의미는 다음과 같습니다.   

 

 

1. MAJOR version when you make incompatible API changes,
2. MINOR version when you add functionality in a backwards-compatible manner, and
3. PATCH version when you make backwards-compatible bug fixes.

 

위의 의미를 해석해보면, MAJOR 버전은 API의 호환성이 깨질만한 변경 사항이 생겼을 때 바꾸며, MINOR 버전은 하위 호환성을 지키면서 기능이 추가된 것을 의미하고, PATCH 버전은 하위 호환성을 지키는 범위 내에서 버그가 수정된 것을 의미합니다.

 

캐럿(^)은 Node.js 모듈이 이 SemVer의 규약을 따른다는 것을 신뢰한다는 가정하에서 동작합니다. 그래서 MINOR나 PATCH 버전은 하위 호환성이 보장되어야 하므로 업데이트를 합니다. 

 

• ^1.0.2 : >=1.0.2 <2.0
• ^1.0 : >=1.0.0 <2.0
• ^1 : >=1.0.0 <2.0

 

그래서 캐럿을 사용했을 때는 위와 같이 동작합니다. 틸드와 비교해 보면 차이점은 명확한데, 1.x.x 내에서는 하위 호환성이 보장되므로 그 내에서는 모두 업데이트하겠다는 의미입니다. 하지만 예외 사항도 있습니다.

 

• ^0.1.2 : >=0.1.2 <0.2.0
• ^0.1 : >=0.1.0 <0.2.0
• ^0 : >=0.0.0 <1.0.0
• ^0.0.1 : ==0.0.1

 

만약 버전이 1.0.0 미만인 경우에는 상황이 다릅니다. 소프트웨어 대부분에서 1.0 버전을 내놓기 전에는 API 변경이 수시로 일어납니다. 그래서 0.1을 사용하다가 0.2를 사용하면 API가 모두 달라졌을 수 있습니다. 그래서 캐럿(^)을 사용할 때 0.x.x에서는 마치 틸드처럼 동작해서 지정한 버전 자릿수 내에서만 업데이트합니다. 그리고 0.0.x인 경우에는 하위 호환성 유지가 안 될 가능성이 더 높으므로 위의 마지막 예시처럼 지정한 버전만을 사용합니다. 

 

 

 

npm 버전 업데이트

지금까지 패키지 버전 관리에 대해 알아봤다면, 패키지 버전은 어떻게 업데이트할 수 있는지 알아보겠습니다. 패키지를 사용하다가 버전을 업데이트할 수 있는 정보를 알고 싶다면, 패키지 최신 버전 정보를 확인해야 합니다. 이는 아래와 같이 설정할 수 있습니다.

 

$ npm view 패키지명

 

위의 명령어를 통해 패키지의 최신 정보를 확인하고 그중에서 버전을 보며 업데이트해야 할 버전이 있는지 여부를 확인할 수 있습니다.

이때 아래의 명령어를 입력하면 프로젝트에 존재하는 모든 패키지의 버전 업데이트 정보를 확인할 수 있습니다.

 

$ npm outdated

 

위와 같이 명령어를 입력했다면, 다음과 같이 사용하고 있는 패키지 중, 버전 관리가 필요한 패키지들의 정보를 보여줍니다.

 

Package     Current  Wanted  Latest  Location                 Depended by
underscore   1.12.1  1.13.2  1.13.2  node_modules/underscore  test

 

Current의 경우 현재 패키지 버전을 의미하며, Wanted는 package.json 에 명시한 버전, 혹은 며시한 버전의 조건 중 사용 가능 한 최신 버전을 의미합니다. 마지막으로 Latest는 해당 패키지의 배포되는 최신 버전을 의미합니다. Current과 Wanted가 같은 경우 업데이트가 필요 없는 상황이며 그 둘이 다른 경우는 업데이트가 필요한 상황입니다. 아래의 명령어를 통해 패키지를 쉽게 Wanted로 업데이트해줄 수 있습니다.

$ npm update # 업데이트가 필요한 모든 패키지를 업데이트함
$ npm update 패키지명 # 해당 패키지만 업데이트함

 

 

 

 

---

 

 

 

 

 

 

 

Node 버전 관리

위에서 패키지 버전 관리에 대해 알아봤습니다. 개발자로서, 패키지 버전에 대해 신경 써야 할 때가 있는데, 특히 다양한 프로젝트를 동시에 관리해야 할 때 버전에 신경 써야 합니다. 사이드 프로젝트에서는 node 12로, 회사에서는 node 14로, 공부할 때는 node 16으로 작업할 때도 있습니다. 하지만 프로젝트 별로 Node 버전이 다른 경우에 nvm을 통해 동적으로 로컬 PC의 Node버전을 변경해서 사용해야 합니다. 하지만 이렇게 변경하면서 사용하는 것은 대단히 귀찮습니다. 그래서 프로젝트의 디렉터리에서는 특정 버전이 고정적으로 적용되는 방법이 필요합니다. 이런 문제를 nodeenv를 활용해서 해결할 수 있습니다. nodeenv를 사용하면 프로젝트별 가상 환경 구성이 가능하게 됩니다. 

 

 

1. 설치

먼저 저는 Mac Monterey (2019 Intel)을 사용하고 있습니다. 이 버전에서 nodeenv를 설치하겠습니다.

 

sudo easy_install nodeenv

 

 

위와 같이 설치하면, 아래 명령어를 통해 nodeenv가 잘 설치되었는지 알 수 있습니다.

 

 

nodeenv --version
// 1.6.0

 

위와 같이 버전이 나온다면, nodeenv를 사용할 준비가 다 되었습니다.

 

 

 

2. 사용법

먼저 터미널을 열어 가상 환경에서 작동시킬 프로젝트 디렉터리로 이동합니다. 그 후 구성하고 싶은 node 버전에 맞게 아래 방법을 사용합니다. 

 

 

1) 최신 버전 사용하고 싶을 때

만약 Node 버전을 최신 버전으로 사용하고 싶다면 아래 명령어를 실행하면 됩니다.

 

nodeenv env

 

그럼 Node 버전의 가상 환경이 구성되는 로그를 볼 수 있습니다. 그 후 디렉터리로 가면, env 디렉터리가 생성된 것을 볼 수 있습니다. 디렉터리의 가상 환경 접속을 할 때는 env 디렉터리를 통해서 할 수 있습니다. 그럼 가상 환경 구성이 되었으니, 가상 환경을 활성화하겠습니다.

 

. env/bin/activate

 

위와 같이 작성하면, 가상 환경 모드로 쉘 모드가 전환되는 것을 알 수 있습니다.

 

 

 

이렇게 (env)가 앞에 들어가면, 가상 환경으로 작동되는 것이고, 이때 명령어들은 모두 가상 환경 node 버전으로 진행됩니다.

 

 

 

2) 특정 버전을 사용하고 싶을 때

만약 최신 버전이 아닌 특정 버전을 사용한다면 다음과 같이 할 수 있습니다. 만약 node: 16.13.0 버전을 설치하고 싶다면, 다음과 같이 작성하면 됩니다.

 

nodeenv --node=16.13.0  env-16.13.0

 

위의 env-16.13.0 작성을 통해, 디렉터리의 이름을 지정합니다. 그럼 이 이름에 맞게 디렉터리가 생성됩니다.

 

 

 

3) Deactivate & Reactive

만약 가상화 활성화에서 나가고 싶다면, 아래 명령어를 통해 나갈 수 있습니다.

 

deactivate_node

 

만약 다시 가상 환경에 들어가야 한다면, . env디렉토리명/bin/activate를 입력하면 됩니다.

 

 

 

 

 

 

3. 주의 사항

nodeenv를 통해 생성된 env 디렉터리 안에는 파일이 많기에, .gitignore를 통해 관리해야 합니다. 

 

 

 

 

---

 

 

 

 

마치며

앞으로도 팀의 발전을 돕는 개발자가 되기 위해 노력하려 합니다. 팀에 필요한 부분이 무엇일지 고민하면서, 팀에 도움이 된다면, 열심히 공부해서 실무에 적용할 수 있는 개발자가 되기 위해 노력하고 싶습니다. 팀의 성장에 기여할 수 있는 개발자가 되겠습니다. 

 

 

 

---

 

 

 

 

 

참고 및 출처

nodeenv를 활용한 프로젝트별 node 가상 환경 관리

GitHub - ekalinin/nodeenv: Virtual environment for Node.js & integrator with virtualenv

node 버전 관리기 nodenv 를 설치해 봅시다.

NPM과 패키지 버전, 관리에 대해 알아보자

npm package.json에서 틸드(~) 대신 캐럿(^) 사용하기 :: Outsider's Dev Story