nodejs, npm, npx, nvm

Node.js

Node.js

Node.js

오픈소스 자바스크립트 엔진에 비동기 이벤트 처리 라이브러리를 결합한 플랫폼으로, 자바스크립트 코드를 브라우저 밖에서도 실행할 수 있도록 돕는 런타임 환경이다

자바스크립트를 브라우저 밖에서도 실행시킬 수 있는 덕에 자바스크립트 관련 도구들과 프레임워크들은 모두 node.js를 기반으로 동작하며, 입출력 처리 성능, 서버 확장, 자바스크립트로의 백엔드 서버 구축 등 다양한 장점으로 사용률을 높일 수 있었다

설치하기

brew install node # 업그레이드는 brew upgrade node
node -v # 버전 체크

LTS (Long-Term Support) 버전 (짝수 버전) 은 안정성과 보안성에 초점을 두어 서버에 사용하기 용이하다

Stable 버전 (홀수 버전) 은 업데이트가 잦으며 프론트엔드 개발에 사용하기 용이하다

패키지 파일로 설치하기

내가 brew를 설치할 수 없다! 또는 OS가 다르다! 한다면 위의 Node.js 홈페이지에서 직접 패키지 파일을 다운받아 설치할 수 있다

잘 설치가 되었나?

node -v

코드 실행하기

node [프로그램명] # 확장자를 붙이지 않아도 된다

npm

npm

npm

Node Package Manager

Node.js에서 사용하는 모듈들을 관리하고 배포하는 패키지 관리자 ⇒ node.js에서 자주 쓰이는 코드들을 패키지로 만들어 배포하는 저장소라고 생각하면 된다

이전엔 Node.js와 별개로 npm도 설치하여야 했지만 지금은 기본 패키지 관리자가 되어 node 설치 시 같이 설치된다

대체재로 Yarn, pnpm 등이 있으며, 성능 개선 및 npm의 중복 설치 문제 등을 해결하기 위해 사용한다

설치하기

brew install node
node -v
npm -v

node를 설치할 시 자동으로 설치된다

패키지 설치하기

npm install [패키지명]
npm i [패키지명]

npm으로 설치한 패키지들과 그 버전은 package.json이라는 버전 관리 파일에 기록되며, 실제 패키지는 node_modules 폴더 안에 저장된다

package.json이 있기 때문에 프로젝트 작업 시 설치한 패키지를 전부 저장소에 올릴 필요가 없고 (대개 gitignore에 해당 폴더 - node_modules를 등록한다), package.json만 저장소에 올린 다음 clone받은 사람이 npm i를 실행하면 package.json에 기록된 모든 의존성 패키지들이 자동으로 설치된다

package.json은 npm init 또는 npm으로 패키지를 설치하면 생성된다

전역 설치

npm install [패키지명] -g

특정 프로젝트에만 유효하도록 설치하는 것이 아닌, 전역으로 설치하여 시스템 내의 모든 프로젝트에 대해 명령어를 사용가능토록 한다

npx

Node Package Execute

npm을 더 편하게 사용하기 위한 도구

npm이 패키지 설치와 관리를 돕는다면, npx는 패키지를 더 쉽게 실행할 수 있게 도와준다

npx 또한 npm 5.2.0 이상 버전을 설치하면 사용할 수 있다

사용하는 이유

라이브러리를 전역 (global) 과 지역 (local) 에 여럿 설치하다 보면 전역 라이브러리와 지역 라이브러리를 따로 관리해야 한다는 문제가 있다

npx를 패키지명과 함께 호출하면 우선 경로 내 (일반적으로 프로젝트 폴더) 에 원하는 패키지가 설치되어 있는지 체크하고,

1. 경로에 패키지가 설치되어 있다면 그것을 실행
2. 경로에 패키지가 설치되어 있지 않다면 가장 최신 버전의 패키지를 설치하고, 실행 후 삭제

따라서 한번 사용하고 말 패키지 (프로젝트 초기화를 돕는 create-react-app 또는 express-generator 등) 는 굳이 설치해서 파일을 가지고 있을 필요 없이 한번만 실행하고 지워버려도 무방하므로, npx를 통해 가장 최신 버전의 패키지를 실행시키고 지워버리면 최신 버전을 설치해야 한다는 부담도 없고 패키지 파일을 굳이 계속 가지고 있을 필요도 없다

주로 create-react-app을 위해 많이 사용하며, 이러한 보일러플레이트는 버전 변동이 매우 잦아 패키지 버전을 관리하기가 어려우며 프로젝트당 한 번 사용하면 그 후에는 사용할 일이 거의 없다

보일러플레이트?

최소한의 변경으로 여러 곳에서 반복적으로 사용하는 코드

예전 텍스트 인쇄판은 똑같은 내용을 반복적으로 프린팅하기 위해 부드러운 납 대신 강철로 만들었는데, 이것을 보일러플레이트라고 불렀다

create-react-app은 한 번의 실행으로 보편적으로 사용하는 react 설정을 완료해 주므로 보일러플레이트라고 부를 수 있다

사용법

npx [로컬에 설치된 패키지명] [인자 또는 플래그]

npm run-script를 거치지 않고 로컬의 패키지를 바로 실행할 때 사용할 수 있다

npx [일회용으로 사용할 패키지명] [인자 또는 플래그]

로컬에 존재하지 않는 패키지를 딱 한 번만 실행하고자 할 때 사용할 수 있다

npx node@6 # 6.x.x버전 node 사용하기

npx를 이용하여 node의 다른 버전을 사용할 수도 있다만 npx 특성상 1회용이므로, 특정 노드 버전에 종속된 스크립트를 실행시키고 싶을 때 사용하면 좋다

npx [gist url]

gist에 저장해둔 스크립트 (gist-based script) 를 실행시킬 수도 있다

nvm

Node Version Manager

https://github.com/nvm-sh/nvm

GitHub - nvm-sh/nvm: Node Version Manager - POSIX-compliant bash script to manage multiple active node.js versions

이름 참 npm이랑 끝내주게 비슷하다 (정말 많이 헷갈렸었다 ㅡ,,ㅡ;;;)

이 녀석은 버전 관리자로, 한 컴퓨터에서 node의 여러 버전을 사용할 수 있도록 도와준다

특정 프로젝트에서 사용하는 node 버전이 다르거나, stable이랑 lts를 동시에 쓰고 싶다거나… 할 때 nvm을 이용하여 버전을 자유롭게 바꿔 사용할 수 있다

설치하기

brew install nvm

brew가 참 신이긴 하다 왠만한 패키지는 다 설치해준다

export NVM_DIR=~/.nvm
source $(brew --prefix nvm)/nvm.sh

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion

설치 후 alias를 설정해주어야 한다

.zshrc 파일에 위와 같이 작성한다 (필자는 위 코드가 적용이 안 돼서 아래 코드를 채택했다)

작성 후, 쉘을 다시 실행한다

근데 난 brew 안씀

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

쉘에 위와 같은 명령어를 입력하여 설치하자

window는 어떡하죠

https://github.com/coreybutler/nvm-windows

GitHub - coreybutler/nvm-windows: A node.js version management utility for Windows. Ironically written in Go.

어떤 친절한 분이 윈도우용 nvm을 배포하셨다

latest release를 설치하자

잘 설치가 되었나?

nvm -v

마찬가지로 nvm -v를 통해 버전을 확인해 보자

버전이 제대로 표시된다면 정상이다

nvm 설치에서 삽질을 엄청 했어서 버전을 보자마자 얼마나 감격했는지 모른다

사용법

버전 확인하기

nvm ls

현재 컴퓨터 (로컬) 에 설치된 모든 node 버전 목록을 알려준다

상단에 화살표 표시된 녀석이 지금 쓰고 있는 버전이다

배포된 모든 버전 확인하기

nvm ls-remote

지금까지의 모든 배포 버전들을 출력한다

길… 길다…. 이래서야 뭐가 뭔지 보기도 힘들다

LTS라고 써있는 게 LTS 배포 중 가장 최신 버전이라는 것은 명확하다

nvm ls-remote --lts

--lts는 lts 버전만 걸러 출력해주는 옵션이다

그래도 길다 하지만 어차피 아래에 제시될 옵션들 덕에 이 많은 버전들을 하나하나 볼 필요는 없다

특정 버전 설치하기

nvm install [버전명] # 예시: nvm install 18.2.0
nvm install --lts # lts 배포 중 가장 최신 버전 설치
nvm install 14 # 14.x.x 배포 중 가장 최신 버전 설치

다양한 옵션을 지정하여 원하는 버전을 선택할 수 있다

설치하려는 버전이 명확하지 않아도 마이너 및 패치 버전명을 생략하고 메이저 버전만 지정하여 설치할 수 있다

특정 버전 사용하기

nvm use [버전명] # 예시: nvm use 18.2.0
nvm use --lts # lts 배포 중 가장 최신 버전 사용
nvm use 14 # 14.x.x 배포 중 가장 최신 버전 사용

install 시와 같은 옵션으로 버전명을 명확하게 적지 않아도 사용이 가능하다

---

참고자료

npm 소개와 설치 (About Node Package Manager)

npx란 무엇일까? 그리고 npm이랑 어떤 차이점이 있을까?

[ReactJS] npm과 npx의 용어정리 및 차이점

npx란 무엇일까?

npm과 npx의 차이에 대해서

보일러플레이트 코드란?(Boilerplate code)

(macOS) NVM으로 Node 버전 관리하기

nvm (Node version Manager) 로 여러 버전의 nodejs 사용하기

GitHub - nvm-sh/nvm: Node Version Manager - POSIX-compliant bash script to manage multiple active node.js versions

https://github.com/coreybutler/nvm-windows