Aller au contenu principal

Annonce de la prise en charge de TypeScript dans Electron

· 5 mins à lire

Le package npm electron inclut désormais un fichier de définition TypeScript qui fournit des annotations détaillées de l’ensemble de l’API Electron. Ces annotations peuvent faciliter vos développements avec Electron même si vous écrivez du JavaScript de base. Il vous suffit d'effectuer la commande npm install electron pour obtenir les types d'Electron à jour dans votre projet.


TypeScript est un langage de programmation open-source créé par Microsoft. C'est un sur-ensemble de JavaScript étendant le langage en ajoutant la prise en charge des types statiques. La communauté TypeScript s'est développée rapidement ces dernières années, et TypeScript s'est classé parmi les langages de programmation les plus appréciés dans une enquête récente de Stack Overflow sur les développeurs . TypeScript est décrit comme un « JavaScript qui évolue », et les équipes de GitHub, Slack, et Microsoft l’utilisent toutes pour écrire des applications Electron évolutives qui sont utilisées par des millions de personnes.

TypeScript prend en charge de nombreuses fonctionnalités parmi les plus récentes de JavaScript, telles que les classes, la déstructuration d’objets et l’async/await, mais sa véritable fonctionnalité de différenciation est les annotations des type. La déclaration des types de données d’entrée et de sortie attendus par votre programme peut réduire les bogues en vous aidant à trouver des erreurs au moment de la compilation, et les annotations peuvent également servir de déclaration formelle de fonctionnement de votre programme.

Lorsque les bibliothèques sont écrites en Javascript de base, les types sont souvent vaguement définis après coup lors de la rédaction de la documentation. Les fonctions peuvent souvent accepter plus de types que ce qui a été documenté ou une avoir des contraintes invisibles qui ne sont pas documentées et ceci peut entraîner des erreurs à l’exécution.

TypeScript résout ce problème avec les fichiers de définition. Un fichier de définition TypeScript décrit toutes les fonctions d'une bibliothèque et ses types d'entrée et de sortie attendus. Lorsque les auteurs de bibliothèque regroupent un fichier de définition typeScript avec leur bibliothèque publiée, les utilisateurs de cette bibliothèque peuvent explorer son API directement dans leur éditeur et commencer à l’utiliser immédiatement, souvent sans avoir besoin de consulter sa documentation.

De nombreux projets populaires comme Angular, Vue.js, node-github (et maintenant Electron!) compilent leur propre fichier de définition et le regroupent avec leur package publié sur npm. Pour les projets ne regroupant pas leur propre fichier de définition, il existe DefinitelyTyped, un écosystème tiers de fichiers de définition gérés par la communauté.

Installation

À partir de la version 1.6.10, chaque version d’Electron inclut son propre fichier de définition TypeScript. Lorsque vous installez le package electron à partir de npm, le fichier electron.d.ts est automatiquement fourni avec le package installé.

Le moyen le le plus sûr d’installer Electron est d’utiliser un numéro de version exact :

npm install electron --save-dev --save-exact

Ou si vous utilisez yarn:

yarn add electron --dev --exact

Si vous utilisiez déjà des définitions tierces telles que @types/electron et @types/node, vous devez les supprimer de votre projet Electron pour éviter toutes collisions.

Le fichier de définition est dérivé de notre documentation API structurée, et sera donc toujours cohérent avec la documentation API de Electron. Installez simplement electron et vous obtiendrez toujours les définitions TypeScript à jour avec la version d'Electron que vous utilisez.

Utilisation

Pour un résumé de l’installation et de l’utilisation des nouvelles annotations TypeScript d’Electron veuillez regarder cette courte démonstration vidéo:

Si vous utilisez Visual Studio Code, vous disposez de la prise en charge de TypeScript intégrée. Il existe également des plugins maintenus par la communauté pour Atom, Sublime, vim, et d’autres éditeurs.

Une fois que votre éditeur est configuré pour TypeScript, vous verrez plus d'indications contextuelles comme des suggestions de saisie semi-automatique, la référence de méthode en ligne, la vérification des des arguments, etc.

Autocompletion d'une méthode

Référence de méthode

Vérification des arguments

Prise en main de TypeScript

Si vous débuter avec TypeScript et que vous souhaitez en savoir plus, cette vidéo d’introduction de Microsoft fournit un bon aperçu des raisons pour lesquelles le langage a été créé, son fonctionnement, son utilisation et sa destinée.

Il existe également un manuel et une appli d'expérimentation sur le site officiel de TypeScript.

Étant donné que TypeScript est un sur-ensemble de JavaScript, votre code JavaScript existant est déjà du Typescript valide. Cela signifie que vous pouvez progressivement transférer un projet JavaScript existant vers TypeScript, en le parsemant selon les besoins de nouvelles fonctionnalités du langage.

Merci

Ce projet n’aurait pas été possible sans l’aide de la communauté des mainteneurs open source d’Electron. Merci à Samuel Attard, Felix Rieseberg, Birunthan Mohanathas, Milan Burda, Brendan Forster, et beaucoup d'autres pour leurs corrections de bogues, améliorations de documentation, et conseils techniques.

Support

Si vous rencontrez des problèmes en utilisant les nouveaux fichiers de définition TypeScript d'Electron, veuillez déclarer un problème sur le dépôt electron-typescript-definitions.

Joyeux TypeScripting!