mizdra's blog

ぽよぐらみんぐ

npm package 実装用のテンプレートを更新した

npm-package-template」という、id:mizdra が爆速で npm package を実装するための開発テンプレートがある。以前ブログで紹介した。

github.com

www.mizdra.net

毎年ちょっとした変更を加えているのだけど、今年は色々な事情があって大きな変更を加えた。高速な formatter/linter が登場したり、npmjs.com へのサプライチェーン攻撃が流行ったり、Coding Agent が普及したり... 時代が変化してるので、それに合わせたテンプレートに変えてみた。

ざっと要点を書き出すと以下のような変更をした。

  • Prettier から Oxfmt に移行
  • ESLint から Oxlint に移行
  • 型チェックは oxlint --type-aware --type-check でやる
  • npm-script に lin-fix を追加
  • AGENTS.md/CLAUDE.md を追加
  • tsconfig.base.json を更新
  • Trusted Publishing でリリースする workflow を追加
  • GitHub Actions のバージョンを pinning
  • GitHub リポジトリの基本的な設定をするためのシェルスクリプトを追加

Oxfmt/Oxlint

Oxfmt/Oxlint が普段使いしても良いレベルに成熟してきたので、Prettier/ESLint に乗り換えてみた。Oxlint 向けには @mizdra/oxlint-config という Shareable Config を作って、それを参照する形にしてる。Oxfmt も Oxlint も特に大きな不満なく動いていていい感じ。

Oxfmt は Shareable Config を実現するための仕組みがないので、設定をパッケージ化せずにベタ書きしてる。けど公式リポジトリを見ると oxfmt.config.ts という形式をサポートする issue が立ってたので、近い将来解決するかも。

多分 oxfmt.config.ts が実装されたら、以下のようなコードで Shareable Config を参照できるようになるはず。

// oxfmt.config.ts
export * from '@mizdra/oxfmt-config';

型チェックは oxlint --type-aware --type-check でやる

TypeScript の型チェックは今まで tsc --noEmit でやってたけど、最近 Oxlint に --type-check というオプションが生えたのでこれを使ってみた。

oxc.rs

このオプションを使うと、なんと lint 結果と一緒に TypeScript のエラーを報告してくれる。Oxlint は型情報を使った lint rule を実行するために内部で TypeScript の型チェックをしていて、その結果をそのまま吐くという仕組みになってる。ESLint 時代はこういうのできなかったので便利になったなあと思う。

ちなみに Oxlint は型チェックに tsgo を fork した tsgolint を使ってるので、型チェック自体も爆速で終わるようになってる。速くて嬉しい。

npm-script に lin-fix を追加

lint-fix": "eslint . --fix" みたいなやつのこと。今までの id:mizdra はまあ npx eslint . --fix と打てば良いだけだし無くても良い派だったのだけど、Coding Agent 向けにはあったら便利そうなので追加してみた。

AGENTS.md/CLAUDE.md

どのリポジトリにもあったら良いものということで、npm-script の使い方や commit message の規則、PR に付けるタグのルールを書いたファイルを置いておいた。AGENTS.md が本体で、CLAUDE.md はそれへの symlink にしてる。symlink できるだけ使いたくない気持ちはあるけどこれ以外良い方法を思いつかなかった。

tsconfig.base.json を更新

"types": ["node"]"noUncheckedSideEffectImports": true を追加したり。以前このブログで紹介した tsconfig.json の推奨オプションをベースに、TypeScript 5.9 で推奨となったオプション を追加しただけ。

近々リリースされる TypeScript 6.0 では "strict": true がデフォルトになったりと色々変わるそうなので、また推奨される tsconfig.json のオプションが変わりそうだなと思ってる。TypeScript 6.0 がリリースされたら見直したい。

Trusted Publishing でリリースする workflow を追加

npm の Trusted Publishing が 2025/7 に GA したので、それを使ったリリース workflow を追加した。

GitHub Actions のバージョンを pinning

サプライチェーン攻撃のリスクを軽減するため、pinact run で GitHub Actions のバージョンを固定した。

GitHub リポジトリの基本的な設定をするためのシェルスクリプトを追加

自分のOSSリポジトリにGitHubのセキュリティ設定を入れ、自分用の手順書を作った - $shibayu36->blog; で紹介されている設定を一発で行うシェルスクリプトを用意した。手でちまちま設定するの面倒だなと思ったのでカッとなって作った。

一部抜粋して紹介。

OWNER=$(gh repo view --json owner -q .owner.login)
REPO=$(gh repo view --json name  -q .name)
# Setup common repository settings
gh repo edit \
  --delete-branch-on-merge \
  --enable-auto-merge \
  --enable-discussions=false \
  --enable-projects=false \
  --enable-secret-scanning \
  --enable-secret-scanning-push-protection \
  --enable-wiki=false
# Enable Code scanning
gh api -X PATCH /repos/$OWNER/$REPO/code-scanning/default-setup -f state=configured
# Enable immutable releases
gh api -X PUT /repos/$OWNER/$REPO/immutable-releases
# Setup rulesets
DEFAULT_BRANCH_PROTECTION=$(gh api /repos/mizdra/npm-package-template/rulesets/13184851)
VERSION_TAG_PROTECTION=$(gh api /repos/mizdra/npm-package-template/rulesets/13184887)
gh api -X POST /repos/$OWNER/$REPO/rulesets --input - <<< $DEFAULT_BRANCH_PROTECTION
gh api -X POST /repos/$OWNER/$REPO/rulesets --input - <<< $VERSION_TAG_PROTECTION
# Require actions to be pinned to a full-length commit SHA
gh api -X PUT /repos/$OWNER/$REPO/actions/permissions -F enabled=true -F sha_pinning_required=true

いくつかの設定は gh repo edit でできるのでそれで設定して、残りは gh api で REST API 叩いて設定してる。欲しかった REST API 全部存在してて GitHub すごい。

ruleset の設定はちょっとハックっぽいことをしてて、mizdra/npm-package-template リポジトリの ruleset を export して、それを新しいリポジトリに import してる。これが一番短く書けるのでこうしてる。mizdra/npm-package-template は公開リポジトリで、公開リポジトリの ruleset は誰でも REST API で読み出せるので、一応このスクリプト自体は誰でも実行できると思う。

あと先ほどのコードには書いてなかったけど、id:mizdra はライセンスファイルの更新をするスクリプトも追加してる。最近 id:anatofuz さんが gh コマンドで gitignore ファイルを生成できると呟いていて、それをみて gh コマンドのリファレンス読んだらライセンスファイルを生成するコマンドを発見したので、それを使ってみている。

# Change license
gh repo license view mit | sed "s/\[year\]/$(date +%Y)/;s/\[fullname\]/mizdra/" > LICENSE
npm pkg set license=MIT && npm i

GitHub のラベルの設定をするスクリプトも追加した。github-label-setup自分向けの label preset を使ってる。

# Setup labels
GITHUB_TOKEN=$(gh auth token) npx \
  -p @azu/github-label-setup \
  -p @mizdra/github-label-presets \
  github-label-setup \
  --labels @mizdra/github-label-presets

おわりに

npm-package-template は CC0-1.0 でライセンスしてるので真似したり参考にしてみてください。

ポケットモンスター・ポケモン・Pokémon・は任天堂・クリーチャーズ・ゲームフリークの登録商標です.

当ブログは @mizdra 個人により運営されており, 株式会社ポケモン及びその関連会社とは一切関係ありません.