TypeScript の人気が高まるにつれて、多くの開発者はこの言語が提供する利点を活用するために静的に型付けされたパッケージを作成しています。この投稿では、TypeScript を使用して NPM パッケージを作成および公開するプロセスについて説明します。
Node.js、NPM、TypeScript がインストールされていることを確認してください。次のコマンドを使用して TypeScript をグローバルにインストールできます:
npm install -g typescript
すべてが正しくインストールされていることを確認してください:
node -v npm -v tsc -v
プロジェクトのディレクトリを作成することから始めます:
mkdir meu-pacote-typescript cd meu-pacote-typescript
Node.js プロジェクトを初期化します:
npm init
これにより、基本的なパッケージ情報を定義できる package.json ファイルが作成されます。
次に、TypeScript プロジェクトを初期化します。
tsc --init
これにより、tsconfig.json ファイルが作成されます。必要に応じて編集しますが、一般的な構成は次のとおりです:
{ "compilerOptions": { "target": "ES6", "module": "CommonJS", "declaration": true, "outDir": "./dist", "strict": true }, "include": ["src/**/*"] }
ここでは、CommonJS モジュールを使用して ES6 コードを生成し、型宣言 (宣言: true) を含めるように TypeScript コンパイラーを構成しています。コンパイルされたコードは dist.
ディレクトリに配置されます。src ディレクトリを作成し、その中にindex.ts ファイルを作成します。
mkdir src touch src/index.ts
index.ts ファイルにパッケージ コードを記述します。文字列を大文字に変換する簡単な関数を作成しましょう:
export function toUpperCase(str: string): string { return str.toUpperCase(); }
TypeScript を JavaScript にコンパイルします:
tsc
これにより、JavaScript ファイルと型宣言が dist ディレクトリに生成されます。
パッケージをテストするには、別のプロジェクトにローカルにインストールします:
npm install ../caminho-para-o-diretorio-do-seu-pacote/dist
import { toUpperCase } from 'nome-do-seu-pacote'; console.log(toUpperCase('hello world')); // "HELLO WORLD"
これにより、JavaScript コードと型宣言の両方が正しく動作することが保証されます。
すべてが正しく動作している場合は、パッケージを公開する準備ができています。
NPM アカウントをまだお持ちでない場合は、アカウントを作成してログインします。
npm login
公開する前に、package.json にビルド スクリプトを追加します。
"scripts": { "build": "tsc" }
そして、package.json に出力パスを追加します:
"main": "dist/index.js", "types": "dist/index.d.ts"
次にコンパイルして公開します:
npm run build npm publish
パッケージ名がすでに存在する場合は、新しい名前を選択する必要があります。
新しいバージョンを公開するには、package.json のバージョンを変更し、npm run build を再度実行して、公開します。
npm publish
NPM で TypeScript パッケージを作成して公開すると、コードの品質が向上するだけでなく、パッケージを使用するユーザーに入力の利点も提供されます。このガイドに従うことで、JavaScript および TypeScript コミュニティとソリューションを共有する準備が整い、より強力で堅牢な開発エコシステムに貢献できます。
プロセスはわかったので、次の TypeScript パッケージの構築を始めてみてはいかがでしょうか?
以上がNPM で TypeScript パッケージを作成して公開する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。