[npx] npm 명령어랑 뭐가 달라?

npm은 관리 툴, npx는 npm에 있는 실행 툴이다. npm 패키지를 설치하지 않고 사용할 수 있게 해주는 도구로, 프로젝트에 추가하거나 전역 패키지로 추가하지 않고, npx를 이용하여 바로 실행할 수 있다.

 

npx is CLI tool.

npx는 패키지 관리 모듈이 아니다. 자바스크립트 패키지 관리 모듈인 npm(Node Package Module)의 5.2.0 버전부터 새로 추가된 CLI 도구다. npm을 좀 더 편하게 사용하기 위해서 npm에서 제공한다. 따라서 npm@5.2.0 이상 버전만 깔려 있다면 npx 명령어를 사용할 수 있다. npx는 npm 레지스트리에 올라가있는 패키지를 쉽게 설치하고 관리할 수 있도록 한다. npm을 좀 더 편하게 사용하기 위해 탄생한 npx는 npm을 통해 설치하는 모든 종류의 Node.js 기반의 파일들을 굉장히 간단하게 설치하고 실행할 수 있게 도와준다.

 

Why npx?

과거 npm으로 패키지를 설치할 때 두 가지 방법이 있었다.

1. 전역으로 패키지를 설치하여 의존성 라이브러리들을 전체적으로 관리하는 방법
2. 특정 프로젝트에만 의존성 라이브러리를 설치하는 방법

전역환경과 로컬환경 각각에서 의존성 라이브러리들이 설치된 채 관리하면, 패키지가 업데이트가 될 때마다 따로 관리해준다면 굉장히 번거로울 것이다. 가뜩이나 굉장히 변화무쌍한 자바스크립트 생태계인데 말이다. 하지만 이러한 문제는 'npx'을 통해 해결할 수 있다. 기존에 npm 설치 방법과는 다르게, npx는 일일이 설치, 실행, 제거를 할 필요 없이, 일회성으로 원하는 패키지를 npm 레지스트리에 접근해서 실행시키고 설치한다. 패키지를 설치하고 업데이트를 하지 않더라도 npm 레지스트리에 올라가 있는 최신 버전을 실행시키고 설치만 시키면 끝이기 때문에 굉장히 간편하다.

npx의 장점

1) 컴퓨터 공간을 낭비하지 않는다.

2) 설치를 실행할 때 마다 새로 다운로드하기 때문에 항상 최신 상태다.

 

When to use?

npx는 다음과 같은 경우에 유용하게 활용할 수 있다.

1. npm run-script를 사용하지 않고 로컬에 설치된 패키지를 실행할 경우
2. 일회성 명령으로 패키지를 실행할 경우
3. 특정 노드 버전의 스크립트를 실행할 경우
4. gist-based scripts를 실행할 경우

 

1. npm run-script를 사용하지 않고, 로컬에 설치된 패키지 실행

{
  "devDependencies": {
    "cowsay": "^1.4.0"
  }
}

$ npx cowsay hi from npx

로컬로 설치된 패키지들을 사용할 수 있게 한다. 만약 프로젝트에 cowsay라는 패키지를 가지고 있다면, npx cowsay만 입력하면 바로 사용할 수 있다.

 

2. 일회성 명령으로 패키지 실행

$ npx create-react-app myProject

로컬에 존재하지 않는 패키지를 실행할 때도 가능하다. npx는 우선적 로컬에 패키지가 설치되어있는지 파악한 후 패키지가 존재하지 않는다면, npm 레지스트리에서 해당 이름의 패키지가 자동으로 설치되고 호출된다. 작업이 끝나면, 설치된 패키지는 로컬 어디에도 없을 것이고, 따라서 장기적으로 오염에 대해 걱정할 필요가 없다.

 

3. 다른 Node.js 버전으로 실행

$ npx node@6 -v
$ npx -p node@7 -- node -v

// npx -p node @ <version> node -v'
// 노드 버전의 일회성 실행을 위해 사용

4. gist-based-script 실행

$ npx {gist url}

Github gist에 올라온 스크립트를 실행할 때 사용할 수 있다. 

 

package-lock.json

프로젝트에 의존성을 추가하면 package-lock.json이라는 파일이 생성된다. 프로젝트에 의존성을 추가하면 자동으로 ‘^최신버전’으로 추가가 되는데, 의존성 버전이 갑자기 변경되지 않도록, 설치된 버전을 고정하는 역할을 한다.

"type" : "module" in package.json

package.json파일에 "type":"module"을 추가해주면 ES module을 사용할 수 있다.