LoginSignup
7
4

@types パッケージ(DefinitelyTyped)の更新差分を見るのに NPM Diff が便利だった

Last updated at Posted at 2024-05-06

この記事の概要

@types (DefinitelyTyped) は TypeScript 用の型定義パッケージです。

DefinitelyTyped のリポジトリにはありとあらゆるライブラリの型定義が登録されています。
そのため、特定のライブラリだけの更新差分を見るのには苦労しがちでした。

しかし、NPM Diff を使ったら自分のやりたいことがさっと解決できたので、備忘録がてら記事にしました。

結論

まずは NPM Diff にアクセスします。

ページ下部にこのような領域があるので、目当ての内容を入力します。

Package Name, Version 1, Version 2と書かれた入力欄と、Generate Diffと書かれたボタンが写ったスクリーンショット。

例えば、React の型定義の差分を見たいとします。
この記事を書いている 2024 年 5 月 7 日現在の最新バージョンは18.3.1なので、その 1 つ前の18.3.0と比較してみましょう。

入力欄にそれぞれ@types/react, 18.3.1, 18.3.0と入力し、Generate Diffをクリックします。
すると以下のページに遷移します。

以下の 4 つのファイルが更新されたようです。

  • README.md
  • index.d.ts
  • package.json
  • ts5.0/index.d.ts

一覧できて便利ですね。

念の為スクリーンショットも載せておきます。

NPM Diff の @types/react の 18.3.1 と 18.3.0 の差分を表示しているページのスクリーンショット。

一覧ページだと、変更量が多いファイルはtoo-bigとだけ表示されて中身を見ることができません。

しかし、左側のナビゲーションから個別ファイルのページへ飛べば、ちゃんと確認できます。

最後に

通常のライブラリであれば、GitHub 上で releases 一覧から compare 機能を使ってすぐに確認できたのでそこまで苦労していませんでした。
ただ、@typesの場合はそれができず、毎回効率の悪い差分の確認の仕方をしていました。

今回外部のサイトを使うことで確認しやすくなりましたが、これが一番良い方法なのかはあまり自信がありません。
もし GitHub 上でも簡単に見られる方法などがあればコメントで教えていただけると幸いです。

7
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
4