Moduły TypeScript

Question

Zastanawiam się, czy można w jakiś sposób mieć dwie lub więcej klas w dwóch lub więcej plikach dodanych do tego samego modułu w TypeScript. Coś takiego:

//src/gui/uielement.ts 
module mylib { 
    module gui { 
     export interface UIElement { 
      public draw() : void; 
     } 
    } 
} 

//src/gui/button.ts 
///<reference path='uielement.ts'/> 
module mylib { 
    module gui { 
     export class Button implements UIElement { 
      constructor(public str : string) { } 
      draw() : void { } 
     } 
    } 
} 

Prawdopodobnie będzie dziesiątki klas GUI, więc posiadanie ich wszystkich w tym samym pliku nie będzie możliwe. Wszystkie moje zajęcia będą w module "mylib". Ale jak to zrobić?

Jeśli module mylib {...} jest przetłumaczony na funkcję, wówczas cała zawartość wszystkich bloków mylib we wszystkich plikach powinna być zawarta w ramach tej samej funkcji.

Czy to w ogóle możliwe?

Kiedy kompilacji otrzymuję to:

$ tsc src/gui/button.ts 
src/gui/button.ts(4,39): The name 'UIElement' does not exist in the current scope 

Answer 1

To jest dokładnie jak to działa! Jeśli spojrzeć na wygenerowanego kodu javascript, to dodać jako anonimowej funkcji, które akceptuje obiektu, „obiekt moduł”:

var mylib; 
(function (mylib) { 
    var Button = (function() { 
     function Button(x) { 
      this.x = x; 
     } 
     return Button; 
    })(); 
    mylib.Button = Button;  
})(mylib || (mylib = {})); 

Jeśli spojrzeć na ostatniej linii (})(mylib || (mylib = {}));) widać, że instancję new ojbect (mylib = {}) tylko wtedy, gdy istniejąca zmienna ma wartość false (lub coś, co zwraca wartość false, np. wartość null). W ten sposób wszystkie "moduły", które mają taką samą nazwę, zostaną scalone z tym samym obiektem.

Dlatego moduły wewnętrzne rozszerzają się wzajemnie. Muszę zauważyć, że nie do końca zrozumiałem, co dzieje się z modułami zagnieżdżonymi.

Aktualizacja: Twój kod działa dla mnie, jeśli nie używam składni zagnieżdżonego modułu, ale zmień go na składnię kropkową. np .:

module mylib.gui { 
} 

zamiast

module mylib { 
    module gui { 
    } 
} 

Postaram się zbadać w dlaczego tak się dzieje, o ile Czytałem spec, obie strony powinny być równe.

Aktualizacja: jeśli zagnieżdżone moduł określany jest oznaczony jako eksport, to działa:

module mylib { 
    export module gui { 
    } 
}