[개념정리] npm와 npx의 차이 정리

1. npm (Node Package Manager)

• Node.js의 패키지 관리 도구

패키지 관리

• 라이브러리를 설치(npm install) / 업데이트(npm update) / 삭제(npm uninstall)
  -> package.json의 dependencies / devDependencies를 관리

스크립트 실행

• package.json에 정의된 스크립트(start, build 등)를 실행

npm run <스크립트명>

전역 설치

• CLI 도구처럼 시스템 전역에서 사용할 수 있도록 설치 가능
• react는 프로젝트 안에서 쓰는 라이브러리라 local 설치
• typescript 컴파일러(tsc)는 CLI 도구라서 global 설치해서 어디서나 실행할 수 있게 함

# 프로젝트에 React 설치
npm install react react-dom

# 내 컴퓨터 전역에 TypeScript 컴파일러 설치 (CLI 도구처럼 사용 가능)
npm install -g typescript
# 설치된 TypeScript 컴파일러 버전 확인
tsc --version

1. CLI란?

• 환경/도구 자체
• 마우스 클릭 대신 명령어를 직접 입력해서 컴퓨터와 상호작용하는 방식
• 명령어를 입력하는 공간
• 예시:
  - Windows -> cmd(명령 프롬프트), PowerShell, Git Bash
  - Mac/Linux -> Terminal

2. CLI 도구란?

• CLI에서 실행할 수 있는 프로그램
• 예시:
  - git -> 깃 버전 관리 도구
  - node -> Node.js 실행기
  - tsc -> TypeScript 컴파일러
  - eslint, prettier, create-next-app …
• 이런 것들은 전역 설치(-g) 해두면, CLI 어디에서나 실행할 수 있음

3. CLI 명령어란?

• CLI 도구를 실행할 때 입력하는 실제 명령어 구문
• 예시:
  - npm install react -> npm 도구에게 "react 패키지 설치해"라고 명령
  - git status -> git 도구에게 "현재 저장소 상태 보여줘"라고 명령
  - tsc --version -> tsc 도구에게 "버전 알려줘"라고 명령

2. npx (Node Package Runner)

• 패키지 실행 도구

로컬 바이너리 실행

• node_modules/.bin에 있는 실행 파일을 편하게 호출 가능

npx prettier --write .

전역 설치 없이 실행

• 패키지를 전역 설치하지 않고 바로 실행

npx create-next-app@latest my-project

일회성 실행

• 설치되지 않은 패키지를 임시 다운로드 후 곧바로 실행

npx create-react-app my-app

• npx는 create-react-app이라는 CLI 도구 패키지를 임시 다운로드해서 실행
• 그 CLI 도구(create-react-app)가 내부적으로

npm install react react-dom ...

이런 걸 실행해서 react, react-dom, 기타 필요한 라이브러리를 '정식 설치' 해줌

특정 버전 실행

npx create-react-app@4 my-app

비교

• npm -> 패키지를 설치·관리하고, 프로젝트 스크립트를 실행할 때 사용
• npx -> 실행 파일(바이너리=bin)을 전역 설치 없이 실행하거나, 로컬 바이너리를 편하게 호출할 때 사용

자주 쓰이는 패턴

• npm run <script> -> 내 프로젝트에 정의된 스크립트 실행
• npx <binary> -> CLI 도구를 전역 설치 없이 실행

npx로 실행 가능한 경우/불가능한 경우

실행 가능한 경우

• CLI 도구 패키지 : 실행 가능한 프로그램을 제공하는 npm 패키지(bin 정의 있음)
  - create-next-app, eslint, prettier, ts-node 등
• 로컬 설치된 바이너리 : 그 패키지를 설치했을 때 생기는 실제 실행 파일
  - npx eslient, npx prettier

실행 불가능한 경우

• 순수 라이브러리 패키지(실행 파일이 없는 경우)

npx react    # ❌ 실행 불가 (bin 없음)
npx lodash   # ❌ 실행 불가 (bin 없음)

npx는 실행용 바이너리(bin)가 있는 패키지를 실행할 때만 사용 가능!!!
npx로 실행 가능한 것 = 실행 파일(bin)이 정의된 CLI 도구