npmパッケージの公開処理をGitHubActionsで自動化する

はじめに

最近、個人開発でnpmパッケージをいくつか開発している。リリースのたびにローカルでビルドして、npm publishを叩いていたが面倒になってきた。

そこで、GitHubActionsを使って公開作業を自動化したのでまとめておく。

手順

npmのアクセストークンを作成

まずはnpmのアカウントアイコンをクリックして表示されるメニューからAccess Tokens > Generate New Token > Granular Access Tokenとトークン作成ページまで遷移する。

Packages and scopesの箇所でパーミッションをRead and Writeと設定し、残りの項目を入力してトークンを作成する。

GitHubActionsの設定

次にGitHubリポジトリの設定ページの左メニューからSecrets and variables > Actions > Repository secretsと遷移し、先ほど作成したnpmのアクセストークンでシークレットを設定する。今回はシークレット名をNPM_ACCESS_TOKENとしておく。これでワークフローから${{ secrets.NPM_ACCESS_TOKEN }}でアクセストークンを取得できるようになった。

次にワークフローファイルを作成する。下の例ではトリガーをタグのプッシュとしているが、お好みで書き換えてほしい。

name: Release

on:
  push:
    tags:
      - '*'

jobs:
  release:
    runs-on: ubuntu-latest
    steps:
      - name: checkout
        uses: actions/checkout@v4
      - name: Setup node
        uses: actions/setup-node@v4
        with:
          node-version: '20.x'
          registry-url: 'https://registry.npmjs.org'
      - name: Install npm packages
        run: npm ci
      - name: build
        run: npm run build
      - name: Publish to npm 
        run: npm publish --access public
        env:
          NODE_AUTH_TOKEN: ${{ secrets.NPM_ACCESS_TOKEN }}

注意点は以下。

• npm publishの際に渡す環境変数名はNODE_AUTH_TOKEN
• パブリックパッケージとして公開するのであればnpm publish --access public
• setup-nodeのステップでregistry-urlをhttps://registry.npmjs.org/に設定する必要がある

完成品は以下のリポジトリに置いているのでよければ参考にしてみてほしい。リリースノートの作成処理も一緒に行なっている。

gatsby-plugin-satorare/.github/workflows/release.yml at main · okaryo/gatsby-plugin-satorare

Gatsby plugin for dynamic OG image generation in JSX - okaryo/gatsby-plugin-satorare

github.com

おわり

GitHubActions周りはドキュメントが整っているので本当に構築が簡単にできてありがたい。

また一つこの世から無駄な作業をなくすことができた。

参考

Node.jsパッケージの公開 - GitHub Docs

継続的インテグレーション（CI）ワークフローの一部として、Node.jsのパッケージをレジストリに公開できます。

docs.github.com