🚀 NPM 패키지 게시 및 GIT 버전 관리 자동화

릴리스를 간소화하여 시간을 절약하고 빌드 프로세스를 개선하세요.

소개

클라이언트에서 사용하도록 의도되고 일종의 빌드 프로세스가 있는 일종의 웹 구성 요소, CSS 라이브러리 등과 같은 일반적인 패키지(본인이 단독 작성자임)에 대한 시나리오를 가정합니다.

위에서 언급했듯이 이 기사는 브랜치에서 활발하게 작업하는 다중 개발자 코드베이스를 위한 것이 아닙니다. 왜냐하면 우리는 푸시할 때 아무 것도 태그하고 싶지 않고 확실히 게시하지 않기 때문에 전용 파이프라인(devops)을 위해 예약되어 있기 때문입니다. .

예를 들어 이 기사에서는 JS 및 SCSS에 knobs을 사용하는 매우 작은 프로젝트인 Rollup 패키지 중 하나에 사용된 코드의 일부를 제공합니다.

📜 NPM 스크립트 - 기초

이 항목은 start , test , version , prepublishOnly 등과 같은 NPM 사용자 지정 스크립트 및 수명 주기 작업에 대한 기본 지식이 있다고 가정합니다.

😥 자동 릴리스 흐름 없이 잘못될 수 있는 것:

프로젝트에는 빌드 프로세스가 필요하므로 릴리스 흐름을 최대한 자동화하지 않으면 원하지 않는 결과가 발생할 수 있습니다.

가져온 배포 파일을 실수로 삭제했습니다.

을 릴리스하기 전에 빌드하는 것을 잊음

버전

에 태그를 지정하는 것을 잊었습니다.

잘못된 git 태그 사용(version에서 package.json과 불일치)

전에 해야 할 일의 순서가 확실하지 않음 publish : should tag before committing or after?

꼬리표 누르는 걸 깜빡

🦺 구함: 위와 같은 일이 발생하지 않도록 보장하는 것.

변경 전의 package.json:

{
  "scripts": {
    "start": "rollup -c rollup.config.dev.js -w",
    "build:prod": "npm run clean && npm run bundle:prod",
    "bundle:prod": "rollup -c rollup.config.prod.js",
    "clean": "rm -rf knobs.min.js",
    "test": "echo \"No test specified\"",
  }
}

꽤 표준적인 스크립트 묶음으로 흥미로운 이야기는 없습니다.

패키지를 게시하려면 자동화되지 않은 릴리스 흐름 예제에서 먼저 npm build:prod 을 실행해야 합니다. 그러면 정리 스크립트가 실행된 다음 watch 명령 없이 실행되는 번들링 스크립트가 실행됩니다. 코드 변경 없음. 그런 다음 커밋하고 git 태그를 추가하고 태그, 모든 것을 푸시한 다음 코드를 게시합니다. (또는 게시한 다음 푸시).

몇 가지 스크립트를 추가하여 개선해 보겠습니다.

위의 작업 흐름을 자동화(또는 반자동화)하는 방법에는 여러 가지가 있지만 매우 유용한 특정 도구에 대해 이야기하고 싶습니다.

https://github.com/sindresorhus/np

np 은 전 세계적으로 가장 잘 설치됩니다. npm i -g np

headr 은 버전, 작성자 이름, 리포지토리 URL 등과 같은 package.json 파일 자체의 정보를 포함하는 dist 파일의 헤더 주석을 자동화하기 위한 훌륭한 패키지입니다. 원하는 경우 설치하십시오.

pkg-ok 은 (중요한) 파일이 누락되지 않았는지 확인하는 또 다른 스크립트입니다. 이 스크립트를 사용하는 것이 좋습니다.

package.json 변경 후 🤟:

{
  "scripts": {
    "start": "rollup -c rollup.config.dev.js -w",
    "build:prod": "npm run clean && npm run bundle:prod",
    "bundle:prod": "rollup -c rollup.config.prod.js",
    "clean": "rm -rf knobs.min.js",
    "test": "echo \"No test specified\"",

    "header": "headr knobs.min.js -o=knobs.min.js --version --homepage",
    "version": "npm run build:prod && npm run header && git add .",
    "prepublishOnly": "pkg-ok"
  }
}

게시 및 푸시에 사용되는 명령은 다음과 같습니다.

np --yolo

🧐 테스트를 건너뛰고(테스트가 없음) --yolo을 정리하지 않고 오랜 시간이 걸릴 수 있는 모든 것을 다시 설치하고 싶기 때문에 node_modules 플래그를 사용하고 있습니다.

np package also allows writing a pre-defined configuration within package.json itself, using the np property.

version(npm 스크립트 속성)은 lifecycle script hook으로 코드를 빌드하고 번들을 출력하고 방금 충돌한 버전 번호와 함께 헤더 주석(모든 파일에)을 추가하기 위해 적절한 시간에 정확하게 실행됩니다.
prepublishOnly(npm 스크립트 속성) 수명 주기 후크는 pkg-ok 을 사용하여 진행하기 전에 누락된 파일이 없는지 확인하기에 좋은 위치입니다.

🏃‍♂️ 위 명령( np --yolo )을 실행하면 GUI가 표시됩니다:(np repo의 스크린샷)



모든 것이 순조롭게 진행되면 패키지가 게시되고 새 브라우저 탭/창에서 프로젝트의 GIT 리포지토리 URL이 열리므로 리포지토리에서 태그가 지정된 새 릴리스를 승인 및 게시할 수 있습니다.