2017-07-31 3 views
1

J'écris une application Angular2, et j'utilise un paquetage NPM externe qui a son propre fichier de typage. Le problème est que le fichier de typage est obsolète - certaines fonctions du paquet sont disponibles, mais ne sont pas déclarées dans le fichier de typage.Extension des typages TS du module dans Angular2

Je veux comprendre:

  1. Comment définir mon propre fichier typages et qu'il soit reconnu par Angular2
  2. Comment étendre une frappe d'interface existante avec de nouveaux membres
  3. Comment écrire le taper de la bonne façon

J'ai essayé Google, mais je n'ai pas trouvé de réponse à l'une de ces trois questions. Je veux dire que j'ai créé un fichier .d.ts, mais je ne sais pas comment le reconnaître, et je ne connais pas la syntaxe correcte.

declare namespace ContentfulClientAPI { 
    export interface ContentfulClientApi { 
     parseEntries(data: any): any; 
    } 
} 

Je spécifiquement essayer d'étendre ContenfulClientAPI défini here:

Répondre

0

je suis arrivé à travailler dans l'éditeur, mais lors de l'exécution « ng build »,-cli angulaire pour une raison quelconque ne trouve pas la nouvelle fonction encore. Il s'avère que angular-cli ne reconnaît que les typages dans le fichier './src/typings.d.ts', donc si vous utilisez angular-cli, ajoutez le chemin dans 'typeRoots' et mettez les caractères dans ce fichier.

  1. Tout d'abord, pour l'éditeur et compilateur de reconnaître les fichiers .d.ts, vous devez modifier la propriété « typeRoots » dans le fichier « tsconfig.json ». La propriété spécifie où le compilateur (et l'éditeur) doit chercher les typages. Par défaut, il ne regarde que dans "node_modules/@ types", mais vous pouvez aussi ajouter "./typings", par exemple.
  2. Dans le nouvel emplacement que vous avez spécifié, créez un nouveau fichier de type, par exemple 'contentful.d.ts' et à l'intérieur créez le type. Suivez ces pour comprendre la syntaxe correcte: https://www.typescriptlang.org/docs/handbook/declaration-files/templates.html

Pour moi, le fichier typages finale ressemble à ceci:

import * as contentful from 'contentful'; 

declare module 'contentful' { 
    export interface ContentfulClientApi { 
     parseEntries(data: any): any; 
    } 
}