環境
- Nodejs v20
- TS 5
以下は、TypeScriptライブラリをnpmに公開する手順の記事です。この記事では、TypeScriptのプロジェクトの初期設定、ビルド、公開、バージョンアップの方法について説明します。
初期設定
TypeScriptライブラリを作成するには、まずnpmのプロジェクトを初期化します。以下のコマンドを実行してください。
npm init -y
これで、package.jsonファイルが生成されます。このファイルには、プロジェクトの名前、バージョン、説明などの基本情報が記述されます。必要に応じて編集してください。
次に、TypeScriptとその型定義ファイル、およびビルドツールとしてtsupをインストールします。以下のコマンドを実行してください。
npm install -D typescript @types/node tsup
これで、node_modulesフォルダとpackage-lock.jsonファイルが生成されます。node_modulesフォルダには、インストールしたパッケージが格納されます。package-lock.jsonファイルには、インストールしたパッケージのバージョン情報が記述されます。
最後に、TypeScriptのコンパイラ設定ファイルであるtsconfig.jsonファイルを生成します。以下のコマンドを実行してください。
npx tsc --init
これで、tsconfig.jsonファイルが生成されます。このファイルには、TypeScriptのコンパイラオプションが記述されます。必要に応じて編集してください。
ビルド
TypeScriptライブラリをビルドするには、tsupを使います。tsupは、TypeScriptをJavaScriptに変換し、CommonJSとESMの両方のモジュール形式で出力するツールです。
まず、package.jsonファイルにビルドスクリプトを追記します。以下のように記述してください。
"scripts": { "build": "npx tsup ./src" },
ここで、./srcはTypeScriptのソースコードが置かれているフォルダです。適宜変更してください。
次に、以下のコマンドを実行してビルドします。
npm run build
これで、distフォルダが生成されます。このフォルダには、JavaScriptと型定義ファイルが出力されます。
公開
TypeScriptライブラリをnpmに公開するには、まずpackage.jsonファイルに公開用の設定を追記します。以下のように記述してください。
"files": [ "dist", "package.json" ], "exports": { ".": { "require": "./dist/index.js", "import": "./dist/index.mjs", "types": "./dist/index.d.ts" } }, "types": "./dist/index.d.ts",
ここで、
filesは公開するファイルやフォルダを指定します。ここでは、distフォルダとpackage.jsonファイルだけを公開します。exportsはモジュールのエントリポイントを指定します。ここでは、CommonJS形式でrequireした場合は./dist/index.jsを、ESM形式でimportした場合は./dist/index.mjsを返します。また、型定義ファイルは./dist/index.d.tsです。typesは型定義ファイルの場所を指定します。ここでは./dist/index.d.tsです。
次に、npmにログインします。以下のコマンドを実行してください。
npm login
これで、npmのユーザー名、パスワード、メールアドレスを入力するプロンプトが表示されます。正しく入力してください。
最後に、npmに公開します。以下のコマンドを実行してください。
npm publish
これで、TypeScriptライブラリがnpmに公開されます。npmのウェブサイトで確認してみてください。
バージョンアップの方法
TypeScriptライブラリを更新する場合は、バージョン番号を変更して再公開します。バージョン番号は、メジャー、マイナー、パッチの3つの数字で構成されます。例えば、v1.0.0というバージョン番号は、メジャーが1、マイナーが0、パッチが0です。
バージョン番号を変更するには、以下のコマンドを実行します。
npm version patch # <- v1.0.0 からv1.0.1 にアップ npm version minor # v1.0.1 からv1.1.0 にアップ npm version major # v1.0.1 からv2.0.0 にアップ
ここで、
patchはバグ修正などの小さな変更を行った場合に使用します。minorは機能追加などの互換性のある変更を行った場合に使用します。- `
