La bonne façon d'utiliser les déclarations TypeScript (* .d.ts) et les interfaces?

Question

Il semble qu'il y ait deux façons d'utiliser les interfaces dans TypeScript: je peux les définir dans des fichiers .ts ordinaires et les importer, ou les définir dans des fichiers .d.ts et les faire découvrir automatiquement par node_modules/@ types ou en ajoutant des chemins pertinents à typeRoots dans tsconfig.json, et ils deviennent "magiquement" disponibles partout.

Actuellement j'ai deux projets: un client (React) et un serveur (Express), les deux écrits en TypeScript. J'ai certaines interfaces que j'utilise dans les deux projets, et afin d'éviter les dépendances entre les projets, j'ai extrait les interfaces communes à un projet séparé dans des fichiers de déclaration. Ensuite, j'ajouté le projet en tant que dépendance dev cette façon:

"@types/my-definitions": "git+ssh://git@github.com/myaccount/my-definitions.git" 

Ce compilateur tapuscrit façon détecte automatiquement les interfaces de node_modules/@ types, et je n'ai pas importer les interfaces.

Ma question est, est-ce une bonne pratique, ou devrais-je plutôt avoir les interfaces à l'intérieur des fichiers .ts ordinaires, importer le projet en tant que dépendance ordinaire et importer explicitement les interfaces que j'utilise? Quels sont les avantages et les inconvénients de chaque approche?

Answer 1

.d.ts Les fichiers sont générés en tant que sortie d'un projet de type (avec le JS compilé) en fonction de vos fichiers .ts.

Généralement, ceux-ci sont importés par le biais d'importations, et non par magie, car ils se trouvent dans un dossier spécialement nommé.

L'heure à laquelle vous voulez mettre .d.ts dans ce dossier magique pour qu'ils soient disponibles pour tout le code est lorsque vous utilisez des globales JS d'environnement définies par DOM/BOM/NodeJS. Vous n'avez pas besoin de les importer explicitement, ils sont juste toujours disponibles (comme ils le seraient en JavaScript)

Cependant, lorsque vous traitez avec une bibliothèque réelle (qui produit du code JavaScript). Vous devez simplement importer la bibliothèque via package.json et configurer TypeScript pour résoudre les modules en examinant node_modules.

Exemple

appel document.createElement() retourne un HTMLElement. En ajoutant des définitions d'environnement, vous n'avez pas besoin d'importer un objet document.

Cependant, supposons que vous utilisez angulaire, lorsque vous voulez utiliser une classe angulaire, vous ne devez explicitement importer

import {Component} from "@angular/core" 

tapuscrit saura rechercher les fichiers ts dans node_modules/@angular/core. Il peut s'agir d'un .ts brut, mais ceux-ci ne sont généralement pas empaquetés en tant que sortie d'un projet TypeScript. En général, vous obtenez uniquement les fichiers JS compilés et les fichiers .d.ts.

Résumé

Vous devez traiter votre code réutilisable comme une bibliothèque tiers comme angulaire et l'importer de la même manière. N'ajoutez pas par magie ces définitions à l'environnement (nous avons assez de globales telles quelles)