LoginSignup
4
5

More than 1 year has passed since last update.

2022年版 TypeScript / モノレポによるライブラリ開発の技術選定

Posted at

背景

TypeScriptのライブラリを作る際は、txdxというツールを使っていたのですが、メンテナンスが不十分で使うに耐えなくなったので、自分で環境構築することにしました。ただ、情報が錯綜して理解するのが大変だったので、そのまとめです。

技術選定を「ビルド」「パッケージ管理」「タスクランナー」「バージョン管理」の4つに分割し、それぞれ見ていくことにします。

ビルド

a. RollUp
b. WebPack(一般的ではない)
c. tsc

RollUpがもっとも一般的であり、現在、ほとんどの有名パッケージではRollUpが使われています。WebPackでも同様のことができますが、ライブラリ用途では一般的ではありません。

ビルドしたい内容がTypeScriptのみであり、単一の形式で出力すれば良い時は、tscを使う方法もあります。チーム内で使えば良いパッケージの場合は、こちらの方法も検討可能です。

ちなみに、個人的にはtsdx(rollupを内部で呼び出すツール)からの移行だったので、迷わずRollUPにしました。

パッケージ管理

a. npm workspace
b. yarn workspace
c. lerna bootstrap (時代遅れ)
d. tsconfigのreference (バンドラーを使わず、tscを直接使う場合のみ)

かつて、Workspaceのパッケージ管理は、lernaを使うのが一般的でしたが、npm, yarnにこの機能が実装されたため、lernaは使わず、npm / yarnのworkspace機能を使うのが一般的になりつつあります。

注意事項として、どの方法を取る場合でも、それぞれのパッケージ管理手法を一貫して取る必要があるということがあります。混ぜるな危険。

ちなみに、バンドラーを使わず、tscで直接ビルドする場合は、tsconfigのreference機能で依存関係を処理することもできます。この場合、tscが1プロセスで済むため、CPU負荷が低いのがメリットですが、package.jsonと二重管理になるのが欠点です。

タスクランナー

a. yarn workspaces foreach
b. lerna run

Workspaces内の全てのパッケージでコマンドを実行する機能です。yarnとlernaには、依存関係を考慮してタスクを実行してくれる機能や並列実行の機能がありますが、npmにこの機能はありません。

基本的には、yarn / lernaの選択になると思います。ただ、tsconfigのリファレンスで依存関係を処理する場合は、依存関係の処理はtsc側でやってくれるので、多くの場合、npm run --workspaces でも問題ないかと思います。

バージョン管理

a. lerna publish
b. 手動バージョン管理

ファイルの変更を検知したり、バージョン番号を自動で割り振ってくれる機能です。これはlernaにしかありません。ただ、lernaを使わないとできないかというとそうではなく、手動で実行するのはありだと思います。

ポイント

lerna

lernaですが、複数の機能の集合体としての要素が強く、異なる機能であれば他のツールと併用可能です。

要するに、npm workspaceを使っているがlenra runだけを使いたい、yarn workspaceを使っているが、lerna publishを使いたい・・・と言ったことが問題なく可能です。

ただし、パッケージ管理の方法だけは統一しましょう。

tscのreference

モノレポ管理で調べるとtscのreferenceを使う方法がしばしば書いてありますが、これは主に、バックエンド / フロントエンドのようにレポジトリ内に複数のプロジェクトを配置することを想定されている機能で、ライブラリ開発には合っていません。ライブラリ開発の場合は、素直にRollUpを使えば良いのではないかと思います。この場合、referenceの設定は不要です。

まとめ

無駄に多くのツールを使いたくないことを考えると、以下の3パターンからの選択がきれいにまとまって良さそうです。こちらは異論もあると思いますが、参考まで。

  1. lerna派
    RollUp
    npm workspace
    lerna run
    lerna publish

  2. Yarn派
    RollUp
    yarn workspace
    yarn workspaces foreach
    手動バージョン管理

  3. tsc派
    tscでビルド
    tsconfigのreferenceで依存関係処理
    npm run -workspaces or yarn workspaces run (依存関係無視)
    手動バージョン管理

4
5
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
4
5