自分で作ったパッケージをnpmに登録するのは怖いのでどこか良い置き場ないかと思ったら、GitHubがnpmなどのパッケージの置き場として使えるようになっていたことを知った。

ここでは、npm向けのパッケージをGitHub Packagesを使って、GitHub上の1つのリポジトリに登録する手順をまとめる。(基本的には「GitHub Packagesについて」の手順に従えば良い)

GitHubリポジトリのPAT作成

まず「GitHub Packagesについて」の「トークンについて」を参考に、パッケージを登録したいリポジトリのPersonal Access Token(PAT)を作成する。トークンのスコープ(権限)は、「トークンについて」に書かれているように、パッケージを登録するために必要なものを正しく設定すること。

npmの設定

「GitHub Packagesで利用するためにnpmを設定する」を参考に、npmの設定である.npmrcで、パッケージのありかを示すregistryを設定する。

GitHub Packagesでは、「パッケージを公開する」に書かれているようにGitHubのユーザ名(組織名)をスコープとして扱うので、「Associating a scope with a registry」を参考に、.npmrc(C:\Users\ユーザ名\.npmrc)に以下のような設定を追加する。

.npmrc

@GitHubのユーザ名:registry https://npm.pkg.github.com
//npm.pkg.github.com/:_authToken=リポジトリのPAT

この設定をしておくと、スコープに応じてパッケージの登録・取得先を変えてくれるようになる。

package.json の設定

パッケージの登録先は、package.jsonで設定する。GitHubのリポジトリ1つあたりに、いくつのパッケージを登録するかで書き方が変わってくる。

1リポジトリに1パッケージの場合

「パッケージを公開する」を参考に、nameフィールドのスコープ=GitHubのユーザ名、パッケージ名=リポジトリ名となるように設定する。

package.json

{
  "name": "@GitHubのユーザ名/リポジトリ名",
  ...
}

1リポジトリに複数パッケージの場合

「同じリポジトリへの複数うパッケージの公開」を参考に、repoisitoryフィールドを以下のように設定する。

package.json

{
  "name": "@GitHubのユーザ名/パッケージ名",
  "repository": {
    "type": "git",
    "url": "https://github.com/GitHubのユーザ名/リポジトリ名.git",
    "directory": "リポジトリ内でこのpackage.jsonが含まれるディレクトリ※"
  },
  ...
}

npm publishはpackage.json毎に行うので、一つのリポジトリで複数パッケージのソースを開発する場合、package.jsonが複数存在することになる。そのため、リポジトリのどこに対象パッケージのpackage.jsonがあるかを示すために、※で示したdirectoryを用いる。

例えば、リポジトリで3つのパッケージがpackagesディレクトリ以下にpackage1～package3のように存在し、その直下にpackage.jsonを置いている場合、

packages
package1/package.json
package2/package.json
package3/package.json

package1のdirectoryにはpackages/package1を設定する。

package.json

{
  "name": "@GitHubのユーザ名/package1",
  "repository": {
    "type": "git",
    "url": "https://github.com/GitHubのユーザ名/リポジトリ名.git",
    "directory": "packages/package1"
  },
  ...
}

directoryを間違えても特に問題なかったので、動作に必要な情報ではないかもしれない。

パッケージをpublishする

「GitHub Packagesへの認証を行う」を参考に、npmのCLIでログインする。予め.npmrcでスコープごとにリポジトリのPATを設定済みであれば、以下のようにログインすることで、npmコマンドがGitHubのリポジトリにパッケージを登録できるようになる。

npm login
> Username: GitHubのユーザ名
> Password: リポジトリのPAT
> Email: GitHubのメールアドレス

ログインできたら、package.jsonがあるディレクトリでnpm publishコマンドを実行することで、package.jsonの設定に従ってパッケージをGitHubのリポジトリへの登録が行われる。

パッケージの登録が成功したら、GitHubのリポジトリ一覧やリポジトリの画面にパッケージが存在することが表示されるようになる。