NPM で TypeScript パッケージを作成して公開する方法

WBOY
リリース: 2024-08-18 07:08:07
オリジナル
941 人が閲覧しました

Como Criar e Publicar Pacotes TypeScript no NPM
TypeScript の人気が高まるにつれて、多くの開発者はこの言語が提供する利点を活用するために静的に型付けされたパッケージを作成しています。この投稿では、TypeScript を使用して NPM パッケージを作成および公開するプロセスについて説明します。


1.環境の構成

Node.js、NPM、TypeScript がインストールされていることを確認してください。
を使用して TypeScript をグローバルにインストールできます。

リーリー

すべてが正しくインストールされているかどうかを確認してください:

リーリー

2.プロジェクトの作成

プロジェクトのディレクトリを作成することから始めます:

リーリー

Node.js プロジェクトを開始する:

リーリー

これにより、基本的なパッケージ情報を定義できる package.json ファイルが作成されます。

3.TypeScriptの設定

次に、TypeScript プロジェクトを初期化します:

リーリー

これにより、tsconfig.json ファイルが作成されます。必要に応じて編集しますが、一般的な設定は次のとおりです:

リーリー

ここでは、CommonJS モジュールを使用して ES6 コードを生成し、型宣言 (宣言: true) を含めるように TypeScript コンパイラーを構成しています。コンパイルされたコードは dist.

ディレクトリに配置されます

4.コードを書く

src ディレクトリを作成し、その中にindex.ts ファイルを作成します:

リーリー

index.ts ファイルにパッケージ コードを記述します。文字列を大文字に変換する簡単な関数を作成しましょう:

リーリー

5.コードのコンパイル

TypeScript を JavaScript にコンパイルする:

リーリー

これにより、JavaScript ファイルと型宣言が dist ディレクトリに生成されます。

6.パッケージをローカルでテストする

パッケージをテストするには、別のプロジェクトにローカルにインストールできます:

  1. テスト プロジェクト ディレクトリで、次を実行します。
リーリー
  1. テスト プロジェクトで関数を使用します:
リーリー

これにより、JavaScript コードと型宣言の両方が正しく動作することが保証されます。

7.NPMでの公開

すべてが正しく動作している場合は、パッケージを公開する準備ができています。

  1. NPMログイン

NPM アカウントをまだお持ちでない場合は、アカウントを作成してログインしてください:

リーリー
  1. 出版

公開する前に、ビルド スクリプトを package.json に追加します:

リーリー

そして package.json に出力パスを追加します:

リーリー

コンパイルして公開します:

リーリー

パッケージ名がすでに存在する場合は、新しい名前を選択する必要があります。

8.パッケージの更新

新しいバージョンを公開するには、package.json でバージョンを変更し、npm run build を再度実行して、公開します:

リーリー

9.グッドプラクティス

  • Documentation: パッケージの使用方法を説明する README.md ファイルを含めます。
  • テスト: Jest などのフレームワークを使用してテストを作成し、コードが期待どおりに動作することを確認します。
  • Linting: コードの品質を維持するには、ESLint や Prettier などのツールを使用します。
  • バージョン管理: SemVer に従ってパッケージのバージョン管理を行います。

結論

NPM で TypeScript パッケージを作成して公開すると、コードの品質が向上するだけでなく、パッケージを使用するユーザーに入力の利点も提供されます。このガイドに従うことで、JavaScript および TypeScript コミュニティとソリューションを共有する準備が整い、より強力で堅牢な開発エコシステムに貢献できます。

プロセスはわかったので、次の TypeScript パッケージの構築を始めてみてはいかがでしょうか?

以上がNPM で TypeScript パッケージを作成して公開する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!