TypeScript パッケージをバンドルする tsup

TypeScript ライブラリを構築していますが、それをバンドルする方法がわかりませんか?つっぷがオススメです

以下は私が考慮する要素です:

1. NPM レジストリでは毎週 100 万件を超えるダウンロードがあります

2. tsup リポジトリには 8.6k のスターがあり、アクティブなメンテナンスが行われます。

3. 十分に文書化されています。

4. shadcn-ui/ui CLI パッケージで使用されます。

5. tsup は内部でロールアップを使用します。

tsup のソース コードを見てみました。そこには、あらゆる種類のメッセージをプッシュし、メッセージをリッスンする Nodejs ワーカー スレッド関連のコードが含まれています。これは勉強するのが楽しいでしょう。これは、私がバンドラーを扱う別の分野に足を踏み入れることを意味します。まだわかりません…

shadcn-ui/ui で使用されている tsup を見つけると、さまざまな点で役立ちます。

1. tsup をどのように実装できるかを学びます

- OSS での実装は、ドキュメントをより適切にナビゲートするのに役立ちます。

- ドキュメント全体を読むのは素晴らしいことですが、一部の人にとっては圧倒されるかもしれません。

2. shadcn-ui のソース コードを読んで、実際の動作を確認してください。 tsup は、shadcn-ui/ui CLI ソース コードで検索すると 2 か所で見つかります:

• パッケージ.json

"scripts": {  
 "dev": "tsup - watch",  
 "build": "tsup",

• tsup.config.ts

import { defineConfig } from "tsup"  

export default defineConfig({  
 clean: true,  
 dts: true,  
 entry: \["src/index.ts"\],  
 format: \["esm"\],  
 sourcemap: true,  
 minify: true,  
 target: "esnext",  
 outDir: "dist",  
})

この時点では、ドキュメントを読んで、これらのオプションが何であるか、スクリプトがどのように構成されているかを学びます。

こうすることで、ドキュメントに圧倒されることがなくなり、何を探しているのかが正確にわかります。これは、ドキュメントを読んで最大限に学ぶための方向性を設定する私の方法です。

これは、私がオープンソース CLI 関連パッケージで TS ライブラリをバンドルする際に行った方法です。

shadcn-ui/ui をゼロから構築する方法を学びたいですか? 最初から構築

をチェックしてください

私について：

ウェブサイト: https://ramunarasinga.com/

Linkedin: https://www.linkedin.com/in/ramu-narasinga-189361128/

Github: https://github.com/Ramu-Narasinga

メール: ramu.narasinga@gmail.com

shadcn-ui/ui を最初から構築する

参考文献:

1. tsup ドキュメント: https://tsup.egoist.dev/

2. npm: https://www.npmjs.com/package/tsup

3. shadcn-ui/ui での tsup の使用: https://github.com/shadcn-ui/ui/blob/main/packages/cli/package.json#L33

4. 私のオープンソース CLI 関連プロジェクト: https://github.com/Ramu-Narasinga/TThroo/blob/main/packages/cli/package.json#L35

以上がTypeScript パッケージをバンドルする tsupの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。