web-dev-qa-db-fra.com

Comment ajouter des types TypeScript à un module JavaScript sans passer à TypeScript?

Je suppose que le titre est quelque peu déroutant, mais je n'ai pas pu le mettre de manière plus concise dans un titre court. Cependant, c'est ce que je veux faire:

  • J'ai un module npm écrit en JavaScript, pas en TypeScript.
  • Certains utilisateurs de ce module utilisent TypeScript, donc ce serait bien si je pouvais fournir des annotations de type pour mon code JavaScript.
  • Mais je ne veux pas passer à TypeScript, mais je veux rester avec du JavaScript pur.

Donc, ce que je recherche, c'est une sorte de manifeste de déclaration de type externe, ou quelque chose comme ça.

Est-ce possible? Si c'est le cas, comment?

S'il vous plaît, restez avec moi s'il s'agit d'une question naïve pour les utilisateurs de TypeScript, mais je n'ai absolument aucune expérience avec TypeScript, et donc je ne sais pas quoi rechercher sur le Web. Peut-être que si quelqu'un peut me pousser dans la bonne direction en me donnant un nom pour ce que je recherche, je pourrai trouver une solution par moi-même.

11
Golo Roden

Ce que vous voudrez créer sont Fichiers de définition . Ces fichiers sont utilisés pour décrire votre JavaScript.

Disons que pour plus de simplicité, vous avez une fonction appelée add, elle prendra deux nombres ou un tableau de nombres.

index.js

exports.add = function add(a, b) {
  if(args.length == 1) return a.reduce((sum, val) => sum + val, 0)
  return a + b; 
}

On peut alors créer un fichier de définition .d.ts, cela décrira notre fonction JavaScript. conserver les noms de fichiers et la structure de fichiers identiques à ceux du JS dans un dossier racine tel que types.

types/index.d.ts

// Accepts two numbers
export declare function add(a: number, b: number): number
// Accepts an array of numbers
export declare function add(a: number[]): number

Tout ce que fait ce fichier est de décrire tous les functions/classes/interfaces/modules, etc. sans aucune logique. Dans le fichier, vous pouvez créer des surcharges comme vous pouvez le voir dans mon exemple. Cela vous permettra de définir plusieurs façons d'utiliser la fonction. Le fichier prend également en charge JSDoc, donc je l'utiliserais également.

Ensuite, nous devons modifier le package.json , cela indiquera à l'analyseur TypeScript où trouver les définitions de ce package.

{
  "types": "types/index.d.ts"
}

C'est tout ce qu'il y a à faire pour créer un .d.ts

12
Get Off My Lawn