현록

npm install -g와 npx 차이

Node 개발을 하다 보면 npm install -gnpx를 자주 만난다.
둘 다 터미널에서 어떤 명령어를 실행하기 위해 쓰는 것처럼 보인다.
예전 문서에는 npm install -g create-react-app 같은 예시가 많고, 요즘 문서에는 npx create-next-app@latest 같은 예시가 많다.

차이는 설치를 남기는지에 있다.
npm install -g는 패키지를 전역으로 설치해서 계속 쓸 수 있게 만든다.
npx는 패키지의 실행 파일을 필요할 때 찾아서 실행한다.

전역 설치의 역할

npm install -g에서 -g는 global을 뜻한다.
패키지를 현재 프로젝트가 아니라 사용자의 전역 npm 위치에 설치한다.

npm install -g typescript

이렇게 설치하면 tsc 같은 실행 파일을 여러 프로젝트에서 바로 사용할 수 있다.
전역 설치는 특정 프로젝트 안의 node_modules가 아니라 컴퓨터의 npm global prefix 아래에 설치된다.

공식 npm 문서도 전역 설치를 로컬 컴퓨터에서 도구처럼 쓰기 위한 방식으로 설명한다.
즉 프로젝트의 코드 의존성이라기보다 사용자의 개발 환경에 설치하는 도구에 가깝다.

npx의 역할

npx는 npm 패키지가 제공하는 실행 파일을 실행한다.
현재 프로젝트에 설치된 패키지를 실행할 수도 있고, 설치되어 있지 않은 패키지를 npm 캐시에 받아서 실행할 수도 있다.

npx create-next-app@latest my-app

이 명령어는 create-next-app을 전역으로 설치해두지 않아도 실행할 수 있게 해준다.
프로젝트 생성처럼 한 번만 쓰는 명령어에는 이런 방식이 잘 맞는다.

npm 문서도 npm 5.2 이상에서는 전역으로 패키지를 실행하는 용도에 npx를 쓰는 흐름을 안내한다.
매번 전역 설치를 늘리는 대신, 필요한 순간에 실행하는 쪽이 더 가볍다.

로컬 설치와의 차이

전역 설치와 npx만 있는 것은 아니다.
팀 프로젝트에서 반복해서 쓰는 도구라면 로컬 의존성으로 설치하는 방식이 더 좋다.

npm install -D eslint

이렇게 설치하면 eslint는 현재 프로젝트의 devDependencies에 기록된다.
팀원이 저장소를 내려받아 npm install이나 npm ci를 실행하면 같은 도구를 사용할 수 있다.

자주 쓰는 명령어는 package.jsonscripts에 넣는다.

{
  "scripts": {
    "lint": "eslint ."
  }
}
npm run lint

이 방식은 전역 설치보다 재현성이 좋다.
내 컴퓨터에 어떤 버전이 전역으로 깔려 있는지에 덜 의존하기 때문이다.
dependenciesdevDependencies를 나누는 기준은 dependencies와 devDependencies 차이에 따로 정리해두었다.

create 명령어의 기준

프로젝트 생성 도구는 npx가 잘 어울린다.
create-next-app, create-vite, create-react-app 같은 도구는 보통 새 프로젝트를 만들 때 한 번 실행한다.

npx create-next-app@latest my-app

이런 도구를 전역으로 설치해두면 나중에 오래된 전역 버전을 실행할 수 있다.
반면 npx create-next-app@latest처럼 쓰면 최신 버전을 명시해서 실행하는 의도가 드러난다.

다만 latest는 항상 같은 버전을 뜻하지 않는다.
교육 자료나 CI에서 재현성이 중요하다면 구체적인 버전을 적는 편이 낫다.

npx create-next-app@16.2.4 my-app

반복 명령어의 기준

반복해서 쓰는 도구는 전역 설치나 매번 npx보다 로컬 설치와 npm run이 더 좋다.
예를 들어 lint, test, format은 팀 전체가 같은 명령어를 반복해서 실행한다.

npm install -D prettier
{
  "scripts": {
    "format": "prettier . --check"
  }
}
npm run format

이렇게 해두면 프로젝트가 사용하는 Prettier 버전이 package.json과 lock 파일에 남는다.
팀원과 CI가 같은 버전으로 검사할 수 있어서 결과가 덜 흔들린다.
scripts 흐름은 package.json scripts와 npm run 정리에 정리해두었다.

전역 설치가 어울리는 경우

전역 설치가 항상 나쁜 것은 아니다.
특정 프로젝트와 상관없이 자주 쓰는 개인용 CLI라면 전역 설치가 편할 수 있다.

예를 들어 로컬 파일을 빠르게 서빙하는 도구나, 개인 작업 흐름에서 자주 쓰는 작은 CLI는 전역으로 설치해도 된다.
다만 팀 프로젝트의 빌드, lint, test를 전역 설치에 의존하게 만드는 것은 피하는 편이 좋다.

전역 설치를 많이 쓰면 컴퓨터마다 버전이 달라질 수 있다.
새 장비를 세팅할 때 같은 전역 패키지를 다시 맞춰야 하는 번거로움도 있다.

권한 오류와 관리 부담

전역 설치는 운영체제와 Node 설치 방식에 따라 권한 오류를 만날 수 있다.
npm 문서도 전역 설치 중 EACCES 권한 오류가 나면 Node 버전 매니저를 다시 쓰거나 npm 기본 디렉터리를 조정하는 방법을 안내한다.

이 문제를 피하려고 sudo npm install -g를 습관적으로 쓰는 것은 조심해야 한다.
권한 문제를 임시로 넘길 수는 있지만, 전역 npm 디렉터리의 소유권이 꼬이거나 보안상 좋지 않은 흐름이 될 수 있다.

가능하면 Node 버전 매니저를 사용하고, 프로젝트 도구는 로컬 의존성으로 관리하는 편이 안전하다.

선택 기준

한 번만 실행하는 프로젝트 생성 명령어라면 npx가 편하다.
전역 설치를 남기지 않고 필요한 실행 파일을 바로 사용할 수 있다.

팀 프로젝트에서 반복해서 실행하는 도구라면 로컬 설치와 npm run이 좋다.
버전이 package.jsonpackage-lock.json에 남고, CI에서도 같은 방식으로 실행할 수 있다.

개인 컴퓨터 전체에서 자주 쓰는 도구라면 npm install -g도 선택지가 될 수 있다.
다만 프로젝트의 동작을 전역 패키지에 의존하게 만들지는 않는 편이 좋다.

정리

npm install -g는 패키지를 전역으로 설치한다.
내 컴퓨터 어디서나 명령어를 쓸 수 있지만, 프로젝트별 버전 관리와는 거리가 있다.

npx는 npm 패키지의 실행 파일을 필요할 때 실행한다.
전역 설치 없이 프로젝트 생성 도구나 일회성 CLI를 실행할 때 편하다.

반복해서 쓰는 팀 도구는 devDependencies에 설치하고 scripts로 실행하는 흐름이 가장 안정적이다.
전역 설치, npx, 로컬 설치를 같은 도구로 보지 말고 사용 목적에 맞게 나누면 npm 명령어가 훨씬 덜 헷갈린다.

참고 자료

관련 포스트
package.json에서 ^와 ~ 차이 thumbnail
package.json에서 ^와 ~ 차이
package.json 의존성 버전 앞에 붙는 ^와 ~의 차이를 초보자 기준으로 정리합니다. semantic versioning, 버전 범위, 0.x 예외, package-lock.json과의 관계까지 함께 봅니다.
npx와 npm exec 차이 thumbnail
npx와 npm exec 차이
npx와 npm exec가 어떤 명령어인지 초보자 기준으로 정리합니다. 로컬 패키지 실행, 원격 패키지 임시 실행, --package 옵션, -- 인자 전달 차이까지 함께 봅니다.
package.json scripts와 npm run 정리 thumbnail
package.json scripts와 npm run 정리
package.json의 scripts와 npm run 명령어를 초보자 기준으로 정리합니다. npm run dev, npm start, npm test, node_modules/.bin, -- 인자 전달 방식까지 함께 봅니다.
dependencies와 devDependencies 차이 thumbnail
dependencies와 devDependencies 차이
package.json의 dependencies와 devDependencies 차이를 초보자 기준으로 정리합니다. npm install과 npm install -D, 배포 환경 설치, package-lock.json과의 관계까지 함께 봅니다.
npm ci란? thumbnail
npm ci란?
npm ci는 CI, 테스트, 배포처럼 같은 의존성 트리를 반복해서 설치해야 하는 환경에 어울리는 clean install 명령어입니다. package-lock.json 조건, npm install과의 차이, .npmrc 플래그 주의점을 정리합니다.
.npmrc 파일이란? thumbnail
.npmrc 파일이란?
storybook을 사용해보려고 하다 마주한 이슈의 해결법을 알아보다가 등장한 .npmrc라는 파일에 대해 공부해보았다. .npmrc 파일이란? .npmrc 파일은 npm에 대한 config 파일이다. (npm에 대한 rc 파일) 프로젝트별 registry, install 옵션, 인증 토큰처럼 npm CLI가 읽는 설정을 관리할 때 사용한다.
스토리북이란? thumbnail
스토리북이란?
Storybook은 UI 컴포넌트를 독립적으로 개발하고, 문서화하고, 테스트하기 위한 프론트엔드 워크샵입니다. Storybook 10.4 기준 설치 흐름과 stories, 문서화, 테스트 활용 방식을 정리합니다.
TTV와 TTI란? thumbnail
TTV와 TTI란?
TTV는 Time to View이며, 사용자가 화면을 보는 시점을 의미한다. TTI는 Time to Interact이며, 사용자가 웹에서 특정 동작을 수행할 수 있는 시점을 의미한다.
Maria DB 외부 접속 설정하기 thumbnail
Maria DB 외부 접속 설정하기
안녕하세요. 오늘은 Maria DB 초기 세팅 시, 외부에서 접속이 안될 때 매뉴얼을 작성해보겠습니다. dotenv 패키지를 통해서 환경변수로 관리한다면, 별도의 추가 작업을 할 일이 없으실 겁니다.
package-lock.json 파일의 역할 thumbnail
package-lock.json 파일의 역할
안녕하세요. 오늘은 node 환경의 개발자라면 한번쯤 궁금했을만한 package-lock.json의 역할에 대해 알아보겠습니다. 우리는 node 환경에서 개발을 할 때 다양한 패키지들을 설치하여 활용하곤 합니다. 우리가 설치하는 패키지 또한 다른 npm 패키지를 활용하여 만든 패키지들이고 이들 또한 설치를 하게 됩니다. 이렇게 직간접적으로 설치된 패키지들은 대부분 호환성을 "^1.1.5"와 같이 표현하여, 범위로 지정해두고 있습니다.
Linux 환경 배포 자동화 체험해보기 thumbnail
Linux 환경 배포 자동화 체험해보기
안녕하세요. 요즘 포트폴리오를 만들면서 서버 상에 자주 반영할 일이 생겼는데, 매번 명령어들을 타이핑하는 것이 비효율적이라 생각이 들어 배포 자동화를 생각해보게 되었습니다. 현재 레벨에서는 단순히 명령어들만 단축시켜도 효율적이라 생각이 들어 간단한 쉘 스크립트만 작성하였습니다. 정말 간단하니 여러분도 도전해보시길 바랍니다.
협업 필수품. Prettier thumbnail
협업 필수품. Prettier
안녕하세요. 오늘은 Prettier이라는 도구에 대해 알려드리고자 합니다. 개발자는 각자의 코딩스타일이 존재합니다. 그러다보니 같은 프로젝트에서도 작성하는 소스마다 스타일이 제각기 다르기 일쑤입니다. 그럴 때 도입하면 좋은 것이 Prettier입니다. 프로젝트 root 폴더에 .prettierrc 라는 파일을 생성한 뒤, 위 예시와 같이 원하는 옵션을 JSON 형식으로 작성해주면 됩니다.