Bonjouroooooo !  J'espère que vous allez bien ! C'est SMY ! 👋 Allons-y directement 🚀  Contenu:  ⚡  Some Background of SDK Development  ⚡  Developing and running our first version  1️⃣ Quoi -  Le SDK (parfois également appelé bibliothèque) sert de plug-in dans les applications pour dériver des fonctionnalités supplémentaires de la technologie.  2️⃣ Pourquoi -  Le développement de SDK avec TypeScript offre une fiabilité sur le long terme grâce à la sécurité des types et à la maintenance à long terme.  3️⃣ Comment -  Les étapes fondamentales requises pour créer le SDK sont les suivantes :  Initialiser le projet avec les bons paramètres de workflow.  Choisir Bundler et comprendre son objectif.  Comprendre ESM, CJS, IIFE UMD pour exécuter le SDK sur différents environnements.  Publication en tant que bibliothèque sur NPM, versionnage sémantique et licence.  NPM pour les SPA et CDN pour les navigateurs.  Dans la première partie, nous allons créer notre premier SDK de base pour acquérir une compréhension de base.  Étape 1 : initialiser le projet  Exécutez la commande suivante pour définir le projet dans un nouveau dossier :   npm init -y    est par défaut oui pour toutes les invites de suivi. Vous pourrez le modifier ultérieurement dans le Package.json comme l'auteur, la licence, la version, etc. "-y"  Rendez-vous sur   et ajoutez   pour fonctionner avec le dernier système de modules EcmaScript (ESM). package.json type: module  Votre   devrait ressembler à ceci : 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" }  Étape 2 : Installer les bibliothèques de développement fondamentales  Manuscrit    - pour travailler TypeScript avec NodeJS. @types/node    - Le moyen le plus simple et le plus rapide de regrouper vos bibliothèques TypeScript. tsup  COPIE   npm i typescript @types/node tsup -D  Étape 3 : Configurer   pour les paramètres TypeScript tsconfig  Créez un fichier   à la racine du projet. tsconfig.json  COPIE   touch tsconfig.json  Accédez au fichier et collez la configuration suivante :   { "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"] }  Vous pouvez survoler chaque propriété pour en savoir plus.  La chose fondamentale à comprendre ici est :  "module": "NodeNext", "sourceMap": true, "outDir": "dist",  "   est la bonne option pour créer des bibliothèques car il vous empêche d'émettre des ESM avec des spécificateurs de module qui ne fonctionnent   dans les bundles mais qui planteront dans Node.js. Lors de l'écriture de code conventionnel, en faisant preuve de bon sens et en s'appuyant sur des dépendances de haute qualité, son la sortie est généralement hautement compatible avec les bundles et autres environnements d'exécution. Vous pouvez en savoir plus ici : NodeNext que   https://blog.andrewbran.ch/is-nodenext-right-for-libraries-that-dont-target-node-js/    - Permet la génération de fichiers sources. Ces fichiers permettent aux débogueurs et à d'autres outils d'afficher le code source TypeScript d'origine lorsqu'ils travaillent avec les fichiers JavaScript émis. Vous pouvez le désactiver pour la production. sourceMap    - Spécifiez un dossier de sortie pour tous les fichiers émis. outDir  /* AND if you're building for a library: */ "declaration": true, /* If your code runs in the DOM: */ "lib": ["es2022", "dom", "dom.iterable"]    - Générez des fichiers .d.ts à partir des fichiers TypeScript et JavaScript de votre projet. declaration    - Spécifiez un ensemble de fichiers de déclaration de bibliothèque groupés qui décrivent l'environnement d'exécution cible.   est destiné aux applications de nœuds comme React et   &   pour exécuter la bibliothèque dans le navigateur. lib es2022 dom dom.iterable  Étape 4 : Écrivez notre premier code  Créez un fichier   et écrivez le code de base suivant : index.ts   const add = (a: number, b: number): number => a + b; const subtract = (a: number, b: number): number => a - b; export { add, subtract };  Construisez notre premier code :  COPIE   tsup ./index.ts  Vous pouvez maintenant voir que nous avons un dossier   avec un fichier de sortie  dist index.cjs  Intégrons et exécutons notre premier SDK !  Créez un fichier   et collez le code suivant : app.js   import { add, subtract } from "./dist/index.cjs"; console.log(add(1, 2)); console.log(subtract(2, 1));  Comme nous n'avons pas publié notre SDK, nous établissons un lien direct avec la version locale.  Maintenant, lancez notre première application   node app.js  Vous devriez voir le résultat suivant :   3 1  Félicitations 🎉🥳 🚀🚀🚀 Nous venons de créer et d'exécuter notre premier SDK !  Emballer:  Nous venons de terminer les étapes de base pour créer et exécuter notre premier SDK. Passez à la partie 2, où nous créerons une structure de dossiers de base et intégrerons un point de terminaison d'API externe 🚀  .....  Vous disposez désormais des connaissances nécessaires pour créer votre propre SDK. Bon codage ! 🚀  C'est tout, les amis ! J'espère que c'était une bonne lecture pour vous. Merci! ✨  👉 Suivez-moi   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

Cet audio est produit dans la langue originale de l'histoire !

Développement du SDK TypeScript : un enfant de 5 ans pourrait suivre cette étape par étape ~ Partie 1 : Notre premier MVP

About Author

COMMENTAIRES

ÉTIQUETTES

CET ARTICLE A ÉTÉ PARU DANS

Related Stories

Nomades numériques, écoutez : ce que vous devez savoir sur le nouveau visa DTV de la Thaïlande

Télégramme : le pont de Crypto Island vers le continent

Croissance des crypto-monnaies : créer des profils d'utilisateurs efficaces

Libérer la puissance de l’IA. Une revue systématique des techniques de pointe : résumé et introduction

Nomades numériques, écoutez : ce que vous devez savoir sur le nouveau visa DTV de la Thaïlande

Télégramme : le pont de Crypto Island vers le continent

Croissance des crypto-monnaies : créer des profils d'utilisateurs efficaces

Libérer la puissance de l’IA. Une revue systématique des techniques de pointe : résumé et introduction

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps