2012-12-20 2 views
6

machen Ich mache ein Jquery Widget mit in Typoskript eingegeben. Wie kann man ein gutes Intellisense bereitstellen, ohne .d.ts schreiben zu müssen?Der beste Weg, um jquery ui mit Typoskript

ex:

/*mywidget.ts*/ 

$.widget("ui.mywidget", { 
    options: { 
     myoption: "" 
    }, 
    doSomething: function() { 
     this._hasDoSomething = true; 
     /*do doSomething*/ 
    }, 
    hasDoSomething: function(): bool { 
     return <bool>this._hasDoSomething; 
    } 
}); 

/*mywidget.d.ts*/ 
interface MyWidgetOptions { 
    myoption: string; 
} 

interface MyWidget extends Widget, MyWidgetOptions {} 

interface NLIB { 
    mywidget: MyWidget; 
} 

interface JQuery { 
    mywidget(): JQuery; 
    mywidget(methodName: string): JQuery; 
    mywidget(options: MyWidgetOptions): JQuery; 
    mywidget(optionLiteral: string, optionName: string): any; 
    mywidget(optionLiteral: string, options: MyWidgetOptions): any; 
    mywidget(optionLiteral: string, optionName: string, optionValue: any): JQuery; 
} 

interface JQueryStatic { 
    nlib: NLIB; 
} 


/// <reference path="teste.d.ts" /> 
$(".teste").mywidget({ 
    myoption: "asdadds" 
}); 

Zu langweilig .d.ts für jedes Plugin zu schreiben. Irgendwelche Alternative?

Anmerkung: Wenn ich nicht enthalten ein mywidget.d.ts dieser Code keine Kompilierung und ich werde nicht intellisense haben:

///<reference path="path/to/jqueryui-1.9.d.ts"/> 
$(".teste").mywidget({ 
    myoption: "asdadds" 
}); 

/* Compiler aus: ... die Eigenschaft 'mywidget' existiert nicht für den Wert 'JQuery' */

+1

Ich glaube, ich teile die Motivation für diese Frage. Ich liebe ** Typoskript, aber ich wünschte, es hätte eine gute Antwort für eine Typoskript- "native" DOM-Manipulationsbibliothek, die erweitert werden könnte, um typoskript-native UI-Widgets (wie Auto-Vervollständigung) zu erstellen. Ich verstehe, warum die JQuery UI Widget Factory (die ich auch liebte, Vor-Typoskript) ist eine schlechte Übereinstimmung hier, aber welche mehr typscripty Lösung ist stattdessen möglich? –

Antwort

10

Das DefinitelyTyped-Projekt auf GitHub bietet Definitionsdateien für die meisten gängigen JavaScript-Bibliotheken.

Alles, was Sie tun müssen, ist die Datei herunterladen, die Sie brauchen, und es in Ihrem Code verweisen wie:

///<reference path="path/to/jqueryui-1.9.d.ts"/> 
+0

Wenn ich keine mywidget.d.ts einschließe, wird dieser Code nicht kompiliert und ich habe keine Intellisense: \t /// . \t $ ("teste") mywidget ({ \t \t myoption: "asdadds" \t}); /* Compiler aus: ... die Eigenschaft 'mywidget' existiert nicht auf den Wert des Typs 'JQuery' */ –

+0

+1 für den Link. – Olaf

+0

Dies sollte als die Antwort markiert werden! – Ahsan

Verwandte Themen