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/index.ts

mkdir src
touch src/index.ts

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

を作成しましょう。

エクスポート関数 toUpperCase(str: string): string { str.toUpperCase() を返します。 }

mkdir src
touch src/index.ts

5.

コードのコンパイル

TypeScript を JavaScript にコンパイル:

tsc

mkdir src
touch src/index.ts

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

6.

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

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

テスト プロジェクト ディレクトリで、次を実行します。

npm install ../パッケージディレクトリへのパス/dist

mkdir src
touch src/index.ts

テスト プロジェクトで関数を使用します。

import { toUpperCase } from 'your-package-name'; console.log(toUpperCase('hello world')); // "こんにちは世界"

mkdir src
touch src/index.ts

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

7.

NPMでの公開

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

1. NPM ログイン

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

npm ログイン

mkdir src
touch src/index.ts

1. 出版物

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

に追加します。

"スクリプト": { "ビルド": "tsc" }

mkdir src
touch src/index.ts

そして、package.json:

に出力パスを追加します。

"メイン": "dist/index.js", "タイプ": "dist/index.d.ts"

mkdir src
touch src/index.ts

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

npm ビルドの実行 npm公開

mkdir src
touch src/index.ts

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

8.

パッケージの更新

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

npm パブリッシュ

mkdir src
touch src/index.ts

9.

ベストプラクティス

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

結論

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

プロセスはわかったので、次の TypeScript パッケージの構築を始めてみませんか?