ホームページ  >  記事  >  ウェブフロントエンド  >  NPM で TypeScript パッケージを作成して公開する方法

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

WBOY
WBOYオリジナル
2024-08-18 07:08:071096ブラウズ

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


1. 環境の構成

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

npm install -g typescript

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

node -v
npm -v
tsc -v

2. プロジェクトの作成

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

mkdir meu-pacote-typescript
cd meu-pacote-typescript

Node.js プロジェクトを初期化します:

npm init

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

3. TypeScript の構成

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

tsc --init

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

{
  "compilerOptions": {
    "target": "ES6",
    "module": "CommonJS",
    "declaration": true,
    "outDir": "./dist",
    "strict": true
  },
  "include": ["src/**/*"]
}

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

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

4. コードの記述

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

mkdir src
touch src/index.ts

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

export function toUpperCase(str: string): string {
  return str.toUpperCase();
}

5. コードをコンパイルする

TypeScript を JavaScript にコンパイルします:

tsc

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

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

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

  1. テスト プロジェクト ディレクトリで、次のコマンドを実行します。
   npm install ../caminho-para-o-diretorio-do-seu-pacote/dist
  1. テスト プロジェクトで関数を使用します。
   import { toUpperCase } from 'nome-do-seu-pacote';

   console.log(toUpperCase('hello world')); // "HELLO WORLD"

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

7. NPM での公開

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

  1. NPM ログイン

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

   npm login
  1. 出版物

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

   "scripts": {
     "build": "tsc"
   }

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

   "main": "dist/index.js",
   "types": "dist/index.d.ts"

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

   npm run build
   npm publish

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

8. パッケージの更新

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

npm publish

9. グッドプラクティス

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

結論

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

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

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

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。