web-dev-qa-db-fra.com

exportation de l'énumération à partir du fichier de définition de type TypeScript

J'écris les définitions de type pour une bibliothèque que j'utilise. Une fonction de la bibliothèque identifie le bouton de la souris cliqué par un entier:

 //index.d.ts
 export as namespace myLib;
 // activates the library listening for a specific mouse button
 function activate(button : number ) : void

J'ai introduit une énumération pour rendre cela plus agréable:

//index.d.ts
export as namespace myLib;
export enum MouseButton {
    LEFT = 1,
    MIDDLE = 2,
    RIGHT = 4
}

export function activate(button : MouseButton ) : void;

Maintenant, lorsque j'importe cette fonction et que je l'utilise, tout se compile mais je suppose que l'énumération est supprimée et indéfinie lorsqu'elle est exécutée dans le navigateur. Le message d'erreur indique Cannot read property 'LEFT' of undefined.

J'ai donc réorganisé les fichiers comme suit:

//MouseButton.ts
export enum MouseButton {
    LEFT = 1,
    MIDDLE = 2,
    RIGHT = 4
}

//index.d.ts
export as namespace myLib;
import {MouseButton} from MouseButton;
export {MouseButton} from MouseButton;
export function activate(button : MouseButton ) : void;

Maintenant je peux import {MouseButton} from "myLib/MouseButton"; import * as myLib from "myLib". Mais cela nécessite deux importations. Référencement myLib.MouseButton compile toujours mais ne s'exécute pas.

Existe-t-il un moyen d'importer et de référencer l'énumération MouseButton via le myLib importé via le import * as myLib déclaration? Je ne cherche pas seulement une réponse expliquant comment le faire, mais une expliquant pourquoi ma solution ne fonctionne pas ou pourquoi elle n'est pas possible. Des conseils sur les ressources expliquant ce qui ne va pas sont également appréciés

PS: J'ai également essayé la syntaxe suggérée ici réexporter l'énumération TypeScript depuis l'espace de noms? mais cela n'a pas fonctionné non plus.

PPS: le module en question est un module UMD du projet de pierre angulaire ( https://github.com/cornerstonejs/cornerstone ) utilisé dans un projet angular 6).

typescripttypescript-typings
5
t.animal

(Pour compléter la réponse de t.animal)

Les fichiers de déclaration sont difficiles à faire: voir le long documentation . Parfois, la recherche dans les fichiers .d.ts existants peut aider.

Concernant enum, les déclarant comme const enum est une approche propre et simple. C'est ce qui est fait pour jquery par exemple, voir @ types/jquery/index.d.ts pour Mouse et Key. C'est pratique car les énumérations standard sont compilées en JavaScript sous forme de tableaux tandis que const enum les membres sont compilés directement en tant que valeurs; voir TypeScript Playground .

3
Romain Deneau

Résolu par l'aide de commentaire de Romain Dena ci-dessus. Cela m'a poussé dans la bonne direction: quel code le compilateur TypeScript génère-t-il à partir d'une énumération (voir https://www.typescriptlang.org/docs/handbook/enums.html#enums-at-runtime )? La déclaration de l'énumération const permet au compilateur TypeScript d'échanger complètement l'identifiant avec la valeur respective, en l'incluant efficacement. Plus de fuite de l'énumération dans le code de production. Merci!

//index.d.ts
export as namespace myLib;

export const enum MouseButton {
    LEFT = 1,
    MIDDLE = 2,
    RIGHT = 4
}

export function activate(button : MouseButton ) : void;
4
t.animal