[npm] npm에 node.js cli 프로그램 배포하기

최근 우아한 테크코스의 오픈미션으로 node.js 환경에서 실행되는 압축 프로그램을 만들었습니다.

과제로 만든 이 프로그램을 실행하려면  git repo clone -> npm run build -> npm start를 해야 하는데,
저는 이 과정이 사용자 입장에서 불편하다고 느꼈습니다.

그래서 npm 레지스트리에 프로젝트를 배포하고, npx로 실행하는 방법을 알아봤습니다.

❗️라이브러리를 배포하는 것이 아닌, CLI 프로그램을 배포하는 것을 목적으로 간단하게 알아봤습니다.

 

npm 이란?

npm(node package manager)은 Node.js 패키지를 관리할 수 있는 도구이기도 하지만,

패키지 저장소(pacakge registry) 서비스이기도 합니다.

 

npm에 프로젝트 배포하기

1. npmjs 계정 생성

npmjs에 접속하여 계정을 생성합니다.

https://www.npmjs.com/

 

2. npmjs 로그인

node.js 프로젝트에서 login을 합니다.

npm login

 

3. package.json 수정

npm start가 아닌 npx로 CLI 프로그램을 실행하기 위해서는 package.json에 몇 가지 프로퍼티를 수정해야 합니다.

{
  "name": "open-mission-compressor",
  "version": "0.0.3",
  "description": "Pack and unpack files",
  "author": "BHyeonKim",
  "repository": {
    "type": "git",
    "url": "https://github.com/Runzipper/core"
  },
  "license": "ISC",
  "type": "module",
  "main": "index.ts",
  "scripts": {
    "start": "./dist/index.cjs",
    "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js",
    "build": "tsup src/index.ts",
    "lint": "prettier --write . && eslint --fix ."
  },
  "bin": {
    "open-mission-compressor": "./dist/index.cjs"
  },
  "files": [
    "dist"
  ],
  ...
}

 

pacakge.json을 보면 다양한 프로퍼티가 있는데,

 

이중 필수 프로퍼티는

• name : 패키지 이름
• version: 패키지 버전

입니다.

 

 

여기에 추가로 CLI 프로젝트를 배포하기 위해서는

• bin : CLI 실행 파일 엔트리 

를 정의하면 됩니다.

 

저 같은 경우는 패키지 이름인 open-mission-compressor를 키로 하여

cli 프로그램의 엔트리를 설정해 줬습니다.

 

이렇게 bin을 설정하면 npx open-mission-compressor를 입력하여 프로그램을 실행할 수 있습니다.

 

4. npm에 publish

npm publish

를 입력하여 프로젝트를 npm에 배포합니다.

 

위 과정을 거치면 프로젝트를 로컬에 clone 할 필요가 없습니다.

단지 "npx 패키지이름"을 입력하여 로컬에 파일이 없으면 npm registry에서 다운로드한 후 실행하고,

파일이 존재하면 다운로드 없이 실행합니다.

 

npm 프로젝트 용량 줄이기

간단하게 package.json에서 bin만 추가해서 npm에 publish 하면 각종 설정파일들과 소스코드 전체가 npm에 올라갑니다.

 

하지만 npx로 프로그램을 다운로드 및 실행하는 사용자 입장에서, 각종 설정파일들과 소스코드는 필요가 없습니다.

사용자에게 필요한 것은 실행가능한 빌드 파일 뿐입니다.

 

npm에 파일들을 선별해서 올리는 방법은 두 가지가 있습니다.

• package.json의 files 프로퍼티를 설정하여 필요한 파일만 npm registry에 올리는 방법
• .npmingore파일을 작성하여 npm registry에 올라가면 안 되는 파일을 제외하는 방법

저는 빌드가 완료된 파일만 npm registry에 올리기 위해 files에 빌드파일의 경로를 작성했습니다.

{
  ...
  "files": [
    "dist"
  ],
  ...
}

 

이렇게 하고서 배포를 하면 npm registry에는 다음과 같이 빌드 폴더와 package.json, README.md만 있는 것을 확인할 수 있습니다.

 

배포 시 주의할 점

package.json version

npm registry에 한번 배포를 하면 같은 버전으로는 배포를 할 수 없습니다.

기능추가나 버그수정등으로 배포가 필요할 시 다음 명령어로 패키지의 버전을 올리고서 배포해야 합니다.

npm version patch // 패치 버전 올리기 0.0.3 → 0.0.4
npm version minor // 마이너 버전 올리기 0.1.0 → 0.2.0
npm version major // 메이저 버전 올리기 0.0.0 → 1.0.0

 

files

files, main에 정의된 파일들은 .npmignore에서 작성하더라도 제외되지 않습니다.

files, main이 우선권을 갖기 때문에 유의해야 합니다.