Giithub Packages 내에서 비공개 라이브러리 구축

주식 태그 Advent Calendar 4일째 보도다.
재고 표시에서 donguri-ui라고 불리는 디자인 시스템과 이를 바탕으로 하는 구성 요소 라이브러리가 활용되어 여러 제품에서 사용되고 있다.디자인 시스템과 라이브러리 자체를 회사 밖으로 공개하는 기업이 늘고 있지만 재고 로고는 현재 공개적으로 사용하지 않는다.
공개되지 않은 경우 npm에서 공개된 방법과는 다른 방법으로 설치해야 한다.그중 하나는 Github Packages 방법을 사용했는데 올해 이 방법을 도입하고 관리했기 때문에 제가 소개해 드리겠습니다.

배경.

Giithub Packages를 사용하기 전에 회사 내부에서 계정과 비밀번호를 공유하는basic 인증을 통해 직접 개인 창고npm install를 진행했다.실제 사용된 설정은 다음과 같습니다.
package.json

"donguri-ui": "git+https://<共用アカウントID>:<パスワード>@github.com/stockmarkteam/donguri-ui.git#master"

이 방법은 Giithub의 보안 변경(2021/8/13 이후 비밀번호 인증에서 창고를 참고할 수 없음) 때문에 사용할 수 없기 때문에 다른 방법으로 변경해야 한다.(참고로 이 대응은 8월 13일 이전에 진행되었다)
이외에git관리하의원본코드에는비밀번호와영패의하드코드가있어semanticversioning이사용되지 않아사용하는측지정버전이번거롭기때문에최신버전을사용하기어렵다.
이러한 문제의 해결책으로 Giithub Packages를 도입했습니다.

대응 내용

여기서 실제로 했던 일을 소개합니다.

라이브러리 측면에서 수정

Giithub Packages는 Scped package@babel/env에서 @ 사이의 범위 이름을 포함하는 포장 이름)만 지원하기 때문에 package입니다.json의 /를 Scoped로 변경해야 합니다.
package.json

- "name": "donguri-ui",
+ "name": "@stockmarkteam/donguri-ui",

마찬가지로 패키지입니다.json에 name 설정을 추가합니다.이때 설정npm publish을 하지 않으면 포장이 공개(누구나 설치할 수 있음)되기 때문에 공개하지 않으려면 이 설정이 필요하다.
package.json

+ "publishConfig": {
+   "access": "restricted",
+   "registry": "https://npm.pkg.github.com/"
+ },

마지막으로 Giithub Actions에서publish에서 Giithub Packages로 설정합니다.이번에 Giithub의 GUI에 발표될 때 이 CI는 도망갈 것이다.

name: donguri-ui をGPRへリリースする

on:
  release:
    types: [created]

jobs:
  publish-gpr:
    needs: build
    runs-on: ubuntu-latest
    permissions:
      packages: write
      contents: read
    steps:
      - uses: actions/checkout@v2
      - uses: actions/setup-node@v1
        with:
          node-version: 12
          registry-url: https://npm.pkg.github.com/
      - (省略)
      - run: npm publish
        env:
          NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}

실제로 이 CI에서 구축 처리를 했지만 내용은 이번에 생략되었다.
이상의 대응에 따라 Giithub Packages는 사내에 라이브러리를 공개할 수 있습니다.다음은 그것을 사용하는 각 제품에 대한 수정을 소개합니다.

사용된 개별 제품 수정

"access": "restricted" 명령을 실행하는 디렉터리에 파일npm을 만들고 다음과 같은 내용을 추가합니다.
.npmrc

//npm.pkg.github.com/:_authToken=${GITHUB_READ_PACKAGES_TOKEN}
@stockmarkteam:registry="https://npm.pkg.github.com"

첫 줄.npmrc에서 개인 가방에 접근하는 데 사용할 영패는 환경 변수를 통해 전달된다.
이 값은 지이허브의 설정 화면에서 개발자가 각자 자신의 계정으로 제작해 각자의 개발 환경으로 설정한 것이다.이때 영패의 권한은 GITHUB_READ_PACKAGES_TOKEN에만 한정되며, 영패가 유출되더라도 피해를 최소화할 수 있다.
또 라이브러리 측에서 포장 명칭, 패키지를 변경했기 때문이다.json이나 가져온 파일이라도 포장 이름을 변경해야 합니다.
package.json

- "donguri-ui": "git+https://<共用アカウントID>:<パスワード>@github.com/stockmarkteam/donguri-ui.git#master",
+ "@stockmarkteam/donguri-ui": "1.0.0",

index.ts

- import DonguriUI from 'donguri-ui';
+ import DonguriUI from '@stockmarkteam/donguri-ui';

Giithub Packages로 변경

실제 운용을 바꾼 결과 다음과 같은 장점이 있다.

read:packages에서 사용한 라이브러리 버전 업그레이드로 최신 버전의 난이도가 낮아졌다

push가 마스터 지점에 도착할 때 구축 결과를 포함해야 하지만,publish 이전에 CI에서 구축할 수 있도록 절차를 바꾸었기 때문에 구축 결과가 필요하지 않습니다

Giithub 계정과 라이브러리에 대한 접근권을 연결할 수 있기 때문에 멤버 변경 시 등의 권한 관리가 수월해졌다

(부차적인 효과로) 라이브러리 관리 방법은 인간화되었지만 이번 업데이트 절차를 엔지니어와 다시 공유하여 라이브러리에 제출한 구성원이 증가했다

CI 설정 등 개발 프로세스 자체는 개선할 여지가 있기 때문에 더 나은 방법을 계속 모색하고 싶다.
또한 Giithub Packages는 Node입니다.js의 포장 이외에도 적용되기 때문에 앞으로 회사 내부 프로그램 라이브러리를 제작할 때도 사용할 수 있습니다.
개인 창고에서 Giithub Packages를 사용할 경우 Giithub Action 이외의 전송량에 따라 요금이 부과됩니다.따라서 다른 CI 서비스를 이용하면 비용이 발생한다.

최후

본고에서 소개한 개선을 진행할 때 공식 문서 외에 PLAID의 npm prive registry에서 GiitHub Packages Registry로 이동 문장을 참고했다.npm prive registry와 Giithub Packages의 비교도 통일되어 있으니 마음에 드는 쪽도 참고해주세요.