pnpm と Changesets を組み合わせて使用する

セットアップ#

changesets を pnpm ワークスペースでセットアップするには、changesets を devDependency としてワークスペースのルートにインストールします。

pnpm add -Dw @changesets/cli

Then run changesets' init command to generate a changesets config:

pnpm changeset init

新しいチェンジセットの追加#

新しいチェンジセットを生成するには、 pnpm changeset をリポジトリのルートで実行します。 .changeset ディレクトリに生成されたマークダウンファイルはリポジトリにコミットします。

変更のリリース#

1. pnpm changeset version を実行します。このコマンド先ほど pnpm changeset によって指定したパッケージ (とそれらのすべての依存) のバージョン更新を適用し、チェンジログファイルを更新します。
2. pnpm install を実行します。このコマンドによりロックファイルの更新とパッケージのビルドを行います。
3. 変更をコミットします。
4. pnpm publish -r を実行します。このコマンドは、レジストリにまだ存在しない BUMP されたバージョンを持つすべてのパッケージを公開します。

Integration with GitHub Actions#

To automate the process, you can use changeset version with GitHub actions. このアクションは、チェンジセットファイルが main ブランチに到達したことを検知し、BUMP されたバージョンを持つすべてのパッケージの一覧を表示する新しいPRを開きます。 The PR will automatically update itself every time a new changeset file arrives in main. Once merged the packages will be updated, and if the publish input has been specified on the action they will be published using the given command.

Add a publish script#

Add a new script called ci:publish which executes pnpm publish -r. This will publish to the registry once the PR created by changeset version has been merged. If the package is public and scoped, adding --access=public may be necessary to prevent npm rejecting the publish.

package.json

{
   "scripts": {
      "ci:publish": "pnpm publish -r"
   },
   ...
}

Add the workflow#

Add a new workflow at .github/workflows/changesets.yml. This workflow will create a new branch and PR, so Actions should be given read and write permissions in the repo settings (github.com/<repo-owner>/<repo-name>/settings/actions). If including the publish input on the changesets/action step, the repo should also include an auth token for npm as a repository secret named NPM_TOKEN.

.github/workflows/changesets.yml

name: Changesets

on:
  push:
    branches:
      - main

env:
  CI: true

jobs:
  version:
    timeout-minutes: 15
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code repository
        uses: actions/checkout@v4

      - name: Setup pnpm and Node.js
        uses: pnpm/setup@v2
        with:
          runtime: node@20
          cache: true

      - name: Create and publish versions
        uses: changesets/action@v1
        with:
          commit: "chore: update versions"
          title: "chore: update versions"
          publish: pnpm ci:publish
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

More info and documentation regarding the changesets action can be found here.