Hallooooooooo!  Hoffe, es geht dir gut! Hier ist SMY! 👋 Lass uns gleich loslegen 🚀  Inhalt:  ⚡  Some Background of SDK Development  ⚡  Developing and running our first version  1️⃣ Was -  SDK (manchmal auch als Bibliothek bezeichnet) dient als Plug-In in Anwendungen, um zusätzliche Funktionen aus der Technologie abzuleiten.  2️⃣ Warum -  Die SDK-Entwicklung mit TypeScript bietet langfristige Zuverlässigkeit aufgrund der Typsicherheit und langfristigen Wartung.  3️⃣ Wie -  Zum Erstellen des SDK sind folgende grundlegende Schritte erforderlich:  Initialisieren des Projekts mit den richtigen Workflow-Einstellungen.  Bundler auswählen und seinen Zweck verstehen.  Verstehen von ESM, CJS, IIFE UMD, um SDK in verschiedenen Umgebungen auszuführen.  Veröffentlichen als Bibliothek auf NPM, semantische Versionierung und Lizenz.  NPM für SPAs und CDN für Browser.  In Teil 1 erstellen wir unser erstes grundlegendes SDK, um ein grundlegendes Verständnis zu erlangen.  Schritt 1: Projekt initialisieren  Führen Sie den folgenden Befehl aus, um das Projekt in einem neuen Ordner festzulegen:   npm init -y    bedeutet standardmäßig „Ja“ für alle Folgeaufforderungen. Sie können es später in Package.json ändern, z. B. Autor, Lizenz, Version usw. "-y"  Gehen Sie zu   und fügen Sie   um mit dem neuesten EcmaScript-Modulsystem (ESM) zu arbeiten. package.json type: module  Ihre   sollte wie folgt aussehen: package.json  { "name": "ts-lib", "version": "1.0.0", "description": "SDK development tutorial", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "type": "module", "keywords": [], "author": "", "license": "ISC" }  Schritt 2: Grundlegende Entwicklungsbibliotheken installieren  Typoskript    – um TypeScript mit NodeJS zu arbeiten. @types/node    – Der einfachste und schnellste Weg, Ihre TypeScript-Bibliotheken zu bündeln. tsup  KOPIEREN   npm i typescript @types/node tsup -D  Schritt 3:   für TypeScript-Einstellungen einrichten tsconfig  Erstellen Sie eine   Datei im Stammverzeichnis des Projekts. tsconfig.json  KOPIEREN   touch tsconfig.json  Gehen Sie zur Datei und fügen Sie die folgende Konfiguration ein:   { "compilerOptions": { /* Base Options: */ "esModuleInterop": true, "allowImportingTsExtensions": true, "emitDeclarationOnly": true, "skipLibCheck": true, "target": "es2022", "allowJs": true, "resolveJsonModule": true, "moduleDetection": "force", "isolatedModules": true, "verbatimModuleSyntax": true, /* Strictness */ "strict": true, "noUncheckedIndexedAccess": true, "noImplicitOverride": true, /* If transpiling with TypeScript: */ "module": "NodeNext", "sourceMap": true, "outDir": "dist", /* AND if you're building for a library: */ "declaration": true, /* If your code runs in the DOM: */ "lib": ["es2022", "dom", "dom.iterable"] }, "exclude": ["node_modules", "dist"] }  Sie können mit der Maus über jede Eigenschaft fahren, um mehr darüber zu erfahren.  Das Grundlegende, was man hier verstehen muss, ist:  "module": "NodeNext", "sourceMap": true, "outDir": "dist",  „   ist die richtige Wahl für die Erstellung von Bibliotheken, da es verhindert, dass Sie ESM mit Modulspezifizierern ausgeben, die   in Bundlern funktionieren, aber in Node.js abstürzen. Wenn Sie konventionellen Code schreiben, gesunden Menschenverstand verwenden und sich auf qualitativ hochwertige Abhängigkeiten verlassen, ist die Ausgabe normalerweise hochkompatibel mit Bundlern und anderen Laufzeiten.“ Hier erfahren Sie mehr darüber: NodeNext nur   https://blog.andrewbran.ch/ist-nodenext-das-richtige-fur-bibliotheken-die-nicht-auf-node-js-abzielen/    – Ermöglicht die Generierung von Quelldateien. Diese Dateien ermöglichen es Debuggern und anderen Tools, den ursprünglichen TypeScript-Quellcode anzuzeigen, wenn mit den ausgegebenen JavaScript-Dateien gearbeitet wird. Sie können es für die Produktion deaktivieren. sourceMap    – Geben Sie einen Ausgabeordner für alle ausgegebenen Dateien an. outDir  /* AND if you're building for a library: */ "declaration": true, /* If your code runs in the DOM: */ "lib": ["es2022", "dom", "dom.iterable"]    – Generieren Sie .d.ts-Dateien aus TypeScript- und JavaScript-Dateien in Ihrem Projekt. declaration    – Geben Sie einen Satz gebündelter Bibliotheksdeklarationsdateien an, die die Ziellaufzeitumgebung beschreiben.   ist für Node-Anwendungen wie React und   &   zum Ausführen der Bibliothek im Browser. lib es2022 dom dom.iterable  Schritt 4: Schreiben Sie unseren ersten Code  Erstellen Sie eine Datei   und schreiben Sie den folgenden Basiscode: index.ts   const add = (a: number, b: number): number => a + b; const subtract = (a: number, b: number): number => a - b; export { add, subtract };  Erstellen Sie unseren ersten Code:  KOPIEREN   tsup ./index.ts  Sie können jetzt sehen, dass wir einen   -Ordner mit einer Ausgabedatei   haben dist index.cjs  Lassen Sie uns unser erstes SDK integrieren und ausführen!  Erstellen Sie eine   Datei und fügen Sie den folgenden Code ein: app.js   import { add, subtract } from "./dist/index.cjs"; console.log(add(1, 2)); console.log(subtract(2, 1));  Da wir unser SDK nicht veröffentlicht haben, verknüpfen wir direkt mit dem lokalen Build.  Führen Sie jetzt unsere erste App aus   node app.js  Sie sollten die folgende Ausgabe sehen:   3 1  Glückwunsch 🎉🥳 🚀🚀🚀 Wir haben gerade unser erstes SDK erstellt und ausgeführt!  Einpacken:  Wir haben gerade die grundlegenden Schritte zum Erstellen und Ausführen unseres ersten SDK abgeschlossen. Gehen Sie zu Teil 2, wo wir eine grundlegende Ordnerstruktur erstellen und einen externen API-Endpunkt integrieren 🚀  .....  Jetzt verfügen Sie über das nötige Wissen, um Ihr eigenes SDK zu erstellen. Viel Spaß beim Programmieren! 🚀  Das war's, Leute! Ich hoffe, es war eine interessante Lektüre für euch. Danke! ✨  👉 Folge mir   GitHub   LinkedIn

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

This story contains new, firsthand information uncovered by the writer.

Read My Stories

View my Portfolio

Full Stack Engineer

Dieses Audio ist in der Originalsprache der Geschichte produziert!

TypeScript SDK-Entwicklung: Ein 5-Jähriger könnte dies Schritt für Schritt nachvollziehen ~ Teil 1: Unser erstes MVP

About Author

KOMMENTARE

Hängeetiketten

DIESER ARTIKEL WURDE VORGESTELLT IN

Related Stories

HackerNoon Decoded 2024: Celebrating Our Life Hacking Community!

HackerNoon Decoded 2024: Wir feiern die Community unserer Technologieunternehmen!

HackerNoon's DeFi Writing Contest with SORA Network: XSTUSD Use Cases

HackerNoon Decoded: The Top 10 Countries Where HackerNoon Is the Most Active

HackerNoon Decoded 2024: Celebrating Our Life Hacking Community!

HackerNoon Decoded 2024: Wir feiern die Community unserer Technologieunternehmen!

HackerNoon's DeFi Writing Contest with SORA Network: XSTUSD Use Cases

HackerNoon Decoded: The Top 10 Countries Where HackerNoon Is the Most Active

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps