TypeScript とセマンティック バージョニングを使用して npm ライブラリを作成して公開する

?最小限のコードを作成して公開する

npm でライブラリを公開するには、次のものが必要です。

1. npm アカウント;ここからサインアップできます。

2. プロジェクトとしてのコード。つまり、コード ディレクトリに package.json があり、名前とバージョンが指定されています。このファイルは次の方法で生成できることに注意してください:
   

npm init

1. プロジェクト内の index.js。ユーザーが関数をインポートできるようにするには、関数をエクスポートする必要があることに注意してください。

注: スクリプトの名前がindex.jsではなく、プロジェクトのルートに配置されている場合は、package.jsonで「main」プロパティを指定する必要があります。詳細については、この回答を参照してください。

名前が npm で取得されている場合は、@name-or-org/your-lib のような接頭辞を追加できます。それは、現在他のほとんどのライブラリが行っていることです。

参考までに私の最小限の例をチェックしてください。しかし、これよりもさらにクールなものを書くこともできると思います。

最後に、CLI コマンドを使用して公開します。

npm publish

パッケージ名にプレフィックスを付けて設定する人への注意: これは、npm ユーザー名または npm に登録した組織名であることが必須です。たとえば、@remi_guan をプレフィックスとして使用できますが、他のプレフィックスは使用できません。

また、npm publish --access public を実行する必要があります。これは、npm は有料機能であるプライベート パッケージを公開したいと考えているためです。

この出力は、成功したことを意味します。ただし、何らかの問題が発生した場合は、Google で検索してトラブルシューティングを行うことができます。独自のライブラリを使用する方法は次のとおりです:

このガイドに従っている場合は、代わりに独自のライブラリを試してください。

さらに詳しく知りたい場合は、@backendbro にこれよりもさらに詳しいガイドがあることもわかりました。

コードを公開した後、コードを更新したい場合は、npm publish を再度実行できます。ただし、公開する前に package.json の version プロパティを更新し、セマンティック バージョニングに準拠してください。

ぜひ試してみてください！あなたのライブラリの v1.0.1 または v1.1.0 を公開して、それを今私がやったように別のプロジェクトで使用できますか? npm ライブラリのバージョンを更新する方法を理解できますか?

? TypeScript を使用する

これまでに作成したこのライブラリは最新のものではありません。型宣言が欠けているため、ライブラリを使用するユーザーは入力によって強調表示されません。また、ECMAScript 構文で TypeScript を使用するのが一般的です。違いについて学ぶには: Node.js モジュール: CommonJS vs. ECMAScript by Saisathish

ただし、この投稿では TypeScript の詳細な設定については省略します。 inapeace0 の「Typescript ライブラリの開発方法」など、TypeScript プロジェクトの初期化方法を学ぶための優れたチュートリアルがたくさんあります。

さらに、多くの最新ツールやベスト プラクティスなどが既に統合されている alexjoverm/typescript-library-starter のようなテンプレート TypeScript リポジトリを使用することもできます。

TypeScript ライブラリを公開する場合の重要な注意事項をいくつか説明します。

1. 公開する前にビルドします。 一般に公開する必要がある場合、最も一般的な Node.js 環境を使用している人は、.js ファイルのみを実行できます。したがって、tsc、rollup (または rollup を使用する vite)、または webpack を使用してコードをコンパイルする必要があります。どれでも大丈夫です。

package.json のモジュール、メイン、またはエントリのプロパティを使用して、コンパイルされたファイルを正しく指定する必要があります。テンプレートを使用して 1 つずつ学習するのが良い選択です。繰り返しますが、alexjoverm/typescript-library-starter がそれらを適切に指定しました。

1. .d.ts ファイルをインクルードします。 同じ理由で、ユーザーは型署名にもアクセスする必要があります。

ただし、ライブラリが Deno、Bun、または ts-node で実行されることが確実な場合は、TypeScript コードのネイティブな実行をサポートしているため、上記のガイドラインは無視してかまいません。

ガイドに従って TypeScript ライブラリを作成し、npm に公開してみてください。最初の例と同様に、まだ簡単です。インポート構文を使用して別のプロジェクトでテストする必要があります。IDE で型ヒントを確認できます。

TypeScript を使用すると、次の構文でライブラリを作成できます。

公開後は、TypeScript のおかげで、インストールしてインポートし、型ヒントを確認できます。

✨ Semantic Versioning

There's a common but slightly advanced problem waiting to be solved: Each time we update our package, we need to edit the version code.

That's annoying, especially if you're frequently updating your code.

However, there are tools to help you out.

• semantic-release: Fully automatic; you can integrate it into GitHub CI to automatically update the version code and publish to npm each time you update your code on GitHub.
• release-it: Also helps you bump the version, but it's simple to use (no need for CI knowledge); meanwhile, you don't configure it as fully automated.

I used ChatGPT to generate this summary comparing the two tools. For new coders, I'd suggest you try release-it, but semantic-release is also convenient if you know how to integrate it with CI.

In this post I'm going to show you how to use release-it, well, after you have made change to the project, simply run this in your project:

npx release-it

And choose is it a minor change or major change, then you're done!

---

Summary

So there you have it! We've walked through publishing a simple npm library, updating it, and even using TypeScript to make it more modern and robust. Remember to:

• Export your functions properly so others can use them.
• Update your version numbers following Semantic Versioning.
• Consider using TypeScript for better type safety and developer experience.
• Automate your releases with tools like release-it or semantic-release to save time.

Give it a try! Publish your own library, update it, and see how it feels to contribute to the npm ecosystem. Happy coding!

以上がTypeScript とセマンティック バージョニングを使用して npm ライブラリを作成して公開するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。