Rumah > hujung hadapan web > tutorial js > Cipta dan terbitkan pustaka npm, dengan TypeScript dan Versi Semantik

Cipta dan terbitkan pustaka npm, dengan TypeScript dan Versi Semantik

DDD
Lepaskan: 2024-09-13 14:15:10
asal
938 orang telah melayarinya

?編寫並發布最少的程式碼

要在 npm 上發布庫,您需要:

  1. 一個npm 帳戶;你可以在這裡註冊。

  2. 您的程式碼作為一個專案;即,您的程式碼目錄中有一個 package.json,其中指定了名稱和版本。請注意,您可以透過以下方式產生此文件:

npm init
Salin selepas log masuk
    您專案中的
  1. index.js。請記住,您需要匯出函數才能允許使用者匯入它。

注意: 如果您的腳本未命名為index.js 並放置在專案根目錄中,則需要在package.json 中指定「main」屬性。請參閱此答案以獲取更多資訊。

如果該名稱已在 npm 上使用,您可以添加 @name-or-org/your-lib 等前綴;這就是當今大多數其他圖書館所做的。

你可以查看我的最小範例作為參考,但我相信你可以寫出比這更酷的東西。

Create and publish an npm library, with TypeScript and Semantic Versioning

最後,使用 CLI 指令發布:

npm publish
Salin selepas log masuk

Create and publish an npm library, with TypeScript and Semantic Versioning

人們設定帶有前綴的套件名稱時請注意:必須是您在npm上註冊的npm使用者名稱或組織名稱。例如,我可以使用 @remi_guan 作為我的前綴,但不能使用其他前綴。

此外,您需要執行 npmpublish --access public,因為 npm 認為您想要發布私有包,這是一項付費功能。

出現這個輸出就表示已經成功了。不過,如果您遇到問題,可以透過 Google 搜尋來排除故障。以下是您如何使用自己的函式庫:

Create and publish an npm library, with TypeScript and Semantic Versioning

如果您一直在遵循本指南,請嘗試使用您自己的程式庫。

如果您想了解更多,我還發現@backendbro 有比這更詳細的指南。

發布程式碼後,當您想要更新程式碼時,可以再次執行 npmpublish。不過,在發布之前,您應該更新package.json的版本屬性,並請遵守語意版本控制。

我建議你試試看!您能否發布您的庫的 v1.0.1 或 v1.1.0,並在另一個專案中使用它,就像我剛剛所做的那樣?你能弄清楚如何更新你的 npm 函式庫的版本嗎?

?使用打字稿

到目前為止,我們創建的這個庫還不是現代的,它缺少類型聲明,因此使用你的庫的人無法透過鍵入來突出顯示。此外,人們通常使用具有 ECMAScript 語法的 TypeScript。要了解差異,請參閱 Saisathish 的《Node.js 模組:CommonJS with ECMAScript》

但是我將在這篇文章中跳過 TypeScript 的詳細設定。有很多很好的教學可以學習如何初始化 TypeScript 項目,例如 inapeace0 的「如何開發 Typescript 函式庫」。

更進一步,您可以使用模板 TypeScript 儲存庫,例如 alexjoverm/typescript-library-starter,它已經整合了許多現代工具、最佳實踐等。

如果您要發布 TypeScript 庫,我只想提一些重要的注意事項:

  1. 發布前建置。 如果需要公開發布,擁有最常見的 Node.js 環境的人只能執行 .js 檔案。所以你需要使用 tsc、rollup(或 vite,它使用 rollup)或 webpack 來編譯你的程式碼;任何一個都可以。

您需要使用package.json中的module、main或entry屬性正確指向編譯後的檔案。使用模板並一一學習是不錯的選擇。再次,alexjoverm/typescript-library-starter 很好地指定了它們。

  1. 包含 .d.ts 檔。 出於同樣的原因,使用者還需要存取類型簽名。

但是如果您確定您的程式庫將在 Deno、Bun 或 ts-node 上運行,您可以忽略我的上述準則,因為它們支援本機運行 TypeScript 程式碼。

請嘗試按照指南建立 TypeScript 庫並將其發佈到 npm。這仍然很簡單,就像第一個例子一樣。您應該使用匯入語法在另一個專案中對其進行測試,並且可以使用 IDE 查看類型提示。

使用 TypeScript,我可以用以下語法寫我的函式庫:

Create and publish an npm library, with TypeScript and Semantic Versioning

發布後,我可以安裝並匯入它,並透過 TypeScript 查看類型提示。

Create and publish an npm library, with TypeScript and Semantic Versioning

✨ 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.

Create and publish an npm library, with TypeScript and Semantic Versioning

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
Salin selepas log masuk

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

Create and publish an npm library, with TypeScript and Semantic Versioning


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!

Atas ialah kandungan terperinci Cipta dan terbitkan pustaka npm, dengan TypeScript dan Versi Semantik. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan