Heim >Web-Frontend >js-Tutorial >Erstellen und veröffentlichen Sie eine NPM-Bibliothek mit TypeScript und semantischer Versionierung

Erstellen und veröffentlichen Sie eine NPM-Bibliothek mit TypeScript und semantischer Versionierung

DDD
DDDOriginal
2024-09-13 14:15:10941Durchsuche

? Schreiben und veröffentlichen Sie einen minimalen Code

Um eine Bibliothek auf npm zu veröffentlichen, benötigen Sie:

  1. Ein npm-Konto; Hier kannst du dich anmelden.

  2. Ihr Code als Projekt; Das heißt, Sie haben eine package.json in Ihrem Codeverzeichnis, in der Name und Version angegeben sind. Beachten Sie, dass Sie diese Datei generieren können über:

npm init
  1. Ein index.js in Ihrem Projekt. Denken Sie daran, dass Sie Ihre Funktion exportieren müssen, damit Benutzer sie importieren können.

Hinweis: Wenn Ihr Skript nicht index.js heißt und im Projektstammverzeichnis abgelegt wird, müssen Sie die Eigenschaft „main“ in package.json angeben. Weitere Informationen finden Sie in dieser Antwort.

Und wenn der Name auf npm übernommen wurde, können Sie ein Präfix wie @name-or-org/your-lib hinzufügen; Das machen heutzutage die meisten anderen Bibliotheken.

Sie können sich mein Minimalbeispiel als Referenz ansehen, aber ich glaube, Sie können etwas Cooleres als das schreiben.

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

Veröffentlichen Sie es abschließend mit dem CLI-Befehl:

npm publish

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

Hinweis für Personen, die den Paketnamen mit einem Präfix festlegen: Es MUSS Ihr NPM-Benutzername oder Organisationsname sein, den Sie bei NPM registriert haben. Beispielsweise kann ich @remi_guan als Präfix verwenden, andere jedoch nicht.

Außerdem müssen Sie npm Publish --access public ausführen, da npm davon ausgeht, dass Sie ein privates Paket veröffentlichen möchten, was eine kostenpflichtige Funktion ist.

Diese Ausgabe bedeutet, dass es erfolgreich war. Wenn Sie jedoch auf ein Problem stoßen, können Sie bei Google nach einer Fehlerbehebung suchen. Und so können Sie Ihre eigene Bibliothek nutzen:

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

Wenn Sie dieser Anleitung gefolgt sind, versuchen Sie es stattdessen bitte mit Ihrer eigenen Bibliothek.

Ich habe auch herausgefunden, dass @backendbro einen sehr detaillierten Leitfaden als diesen hat, falls Sie mehr wissen möchten.

Nachdem Sie Ihren Code veröffentlicht haben und den Code aktualisieren möchten, können Sie npm Publish erneut ausführen. Vor der Veröffentlichung sollten Sie jedoch die Versionseigenschaft von package.json aktualisieren und die semantische Versionierung einhalten.

Ich empfehle Ihnen, es auszuprobieren! Können Sie die Version 1.0.1 oder 1.1.0 Ihrer Bibliothek veröffentlichen und in einem anderen Projekt verwenden, wie ich es gerade getan habe? Können Sie herausfinden, wie Sie die Version Ihrer NPM-Bibliothek aktualisieren können?

? Verwenden Sie TypeScript

Diese Bibliothek, die wir bisher erstellt haben, ist nicht modern, ihr fehlt die Typdeklaration, sodass Personen, die Ihre Bibliothek verwenden, beim Tippen nicht hervorgehoben werden können. Außerdem wird TypeScript häufig mit ECMAScript-Syntax verwendet. Um mehr über den Unterschied zu erfahren: Node.js-Module: CommonJS vs. ECMAScript von Saisathish

Aber ich werde die detaillierte Einrichtung von TypeScript in diesem Beitrag überspringen. Es gibt viele gute Tutorials, um zu lernen, wie man ein TypeScript-Projekt initialisiert, wie zum Beispiel „So entwickeln Sie eine TypeScript-Bibliothek“ von inapeace0.

Darüber hinaus können Sie ein TypeScript-Vorlagen-Repository wie alexjoverm/typescript-library-starter verwenden, das bereits viele moderne Tools, Best Practices usw. integriert hat.

Ich möchte nur einige wichtige Hinweise erwähnen, wenn Sie eine TypeScript-Bibliothek veröffentlichen:

  1. Erstellen Sie, bevor Sie es veröffentlichen. Wenn Sie es öffentlich veröffentlichen müssen, können Benutzer mit der gängigsten Node.js-Umgebung nur .js-Dateien ausführen. Sie müssen Ihren Code also mit tsc, rollup (oder vite, das Rollup verwendet) oder webpack kompilieren; Jeder ist in Ordnung.

Sie müssen korrekt auf die kompilierte Datei verweisen, indem Sie Modul-, Haupt- oder Eintragseigenschaften in package.json verwenden. Es ist eine gute Wahl, eine Vorlage zu verwenden und sie einzeln zu erlernen. Auch hier hat alexjoverm/typescript-library-starter sie gut spezifiziert.

  1. Fügen Sie eine .d.ts-Datei hinzu.Aus dem gleichen Grund benötigt der Benutzer auch Zugriff auf die Typsignaturen.

Aber wenn Sie sicher sind, dass Ihre Bibliothek auf Deno, Bun oder ts-node läuft, können Sie meine oben genannten Richtlinien ignorieren, da sie die native Ausführung von TypeScript-Code unterstützen.

Bitte versuchen Sie, einer Anleitung zu folgen, um eine TypeScript-Bibliothek zu erstellen und sie auf npm zu veröffentlichen. Es ist immer noch einfach, wie im ersten Beispiel. Sie sollten es mit einem anderen Projekt unter Verwendung der Importsyntax testen und Sie können Typhinweise mit einer IDE sehen.

Mit TypeScript kann ich meine Bibliothek in dieser Syntax schreiben:

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

Und nach der Veröffentlichung kann ich es installieren und importieren und dank TypeScript die Typhinweise sehen.

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

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!

Das obige ist der detaillierte Inhalt vonErstellen und veröffentlichen Sie eine NPM-Bibliothek mit TypeScript und semantischer Versionierung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn