Le géant du paiement électronique PayPal a ajouté des définitions de type TypeScript dans son SDK JavaScript, paquet paypal-js npm.
Les types TypeScript permettront aux développeurs JavaScript de profiter des mêmes avantages que les utilisateurs de TypeScript, tels que des définitions de type détaillées, des liens directs vers la documentation et des conseils de type. Avec tout cela désormais à leur disposition, les développeurs d’applications seront “beaucoup plus productifs lors de l’écriture d’applications”, a expliqué Jamund Ferguson, responsable des relations avec les développeurs Paypal, dans un récent article de blog.
Les définitions de type de PayPal peuvent être importées ensemble dans le cadre du chargerScript() méthode ou personne utilisant le type d’importation Fonctionnalité. L’article suivant mettra en évidence certaines des fonctionnalités du package et expliquera comment “utiliser les définitions de type pour accélérer le développement de vos applications PayPal”.
L’installation du package est la même que vous utilisiez le chargerScript() ou type d’importation Fonctionnalité.
npm install @paypal/paypal-js
Définitions de type avec LoadScript
La paypal-js permet un chargement facile du SDK JavaScript PayPal de manière asynchrone. Le processus est le suivant :
- La paypal-js module fournit le chargerScript() méthode.
- La chargerScript() injecte le SDK tag sur la page.
- Lorsque la balise de script est injectée sur la page, une promesse est renvoyée.
- La promesse est résolue après le chargement réussi du script.
Les tâches telles que la gestion des erreurs et le rechargement du script lorsque les paramètres changent (changements de devise par exemple) sont beaucoup plus faciles à l'aide de cet utilitaire.
L'image ci-dessous représente un exemple d'utilisation de base.
Conseils TypeScript
Dans les fichiers TypeScript et JavaScript, la saisie semi-automatique TypeScript apparaît dès que Paypal est tapé à l'intérieur du loadScript rappeler. La saisie semi-automatique affichera toutes les priorités possibles sur l'espace de noms PayPal (avec navigation disponible pour plus de détails sur chacune).
Les définitions de type TypeScript décrivent ce qui est attendu pour l'entrée et quelle sera la valeur de retour attendue. Dans l'exemple ci-dessus, cela se voit dans l'option en surbrillance du menu déroulant pour le bouton Créer une commande. Juste à côté, il y a un deuxième menu montrant exactement ce qui est attendu à l'intérieur du bouton de création de commande.
créerCommande prend un rappel qui peut prendre deux paramètres : un enregistrement et Créer des actions de commande. L'enregistrement est un objet JavaScript standard avec la clé étant une chaîne et la valeur répertoriée comme inconnue, ce qui signifie qu'il peut s'agir de n'importe quoi. Cela renverra une promesse qui contient le numéro de commande, une valeur de chaîne. Le deuxième paramètre, Créer des actions de commande est un autre objet.
L'IDE notera une erreur si quelque chose est manquant ou mal saisi.
Passer la souris sur le texte fournira des informations détaillées sur les arguments manquants et appuyer sur cmd-clic sur le créerCommande amènera le développeur directement à la définition TypeScript.
Activer les fonctionnalités supplémentaires
Bien que les définitions de type du SDK JavaScript soient complètes au quotidien, les méthodes prises en charge dépendent du paramètre de requête des composants transmis au SDK JavaScript. étiquette. Les boutons sont la seule méthode prise en charge par défaut. La guide de configuration des scripts contient plus de détails sur la sélection des composants nécessaires.
Définitions TypeScript sans LoadScript
La chargerScript() La méthode n'est pas requise pour activer les définitions TypeScript dans l'application d'un utilisateur. En utilisant le type d'importation syntaxe plutôt que la plus courante importer La syntaxe contournera l'introduction de la dépendance dans une application et accordera l'accès aux avantages de TypeScript au moment de la construction sans ajouter à la taille du bundle.
Importer et type d'importation du paypal-js module donnent tous deux accès aux définitions de type pour le loadScript module et le global fenêtre.paypal variable aussi.
Tous les types gérés pour le SDK JavaScript PayPal sont exportés directement à partir de la racine du paypal-js module et peuvent être importés individuellement.
Dans l'exemple ci-dessus, les deux monintention et code postal les propriétés sont mal saisies, provoquant une erreur similaire à celle de l'image ci-dessous. Cela illustre les similitudes entre les fonctionnalités de définition de type lors de l'utilisation de la syntaxe de type d'importation et d'importation.
Il existe des dizaines de types liés à PayPal, chacun avec sa propre documentation complète sur ses propriétés et son objectif, disponible pour une utilisation dans les applications.
Image vedette via Shutterstock.