TypeScript модули

Мне интересно, возможно ли как-то иметь два или более классов в двух или более файлах, добавленных в тот же модуль в TypeScript. Что-то вроде этого:

//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 { }
        }
    }
}

Вероятно, будут десятки классов GUI, поэтому их всех в одном файле невозможно. И все мои классы будут в модуле "mylib". Но как мне это сделать?

Если module mylib {...} переводится в функцию, то все содержимое всех блоков mylib во всех файлах должно содержаться в одной и той же функции.

Возможно ли это?

Когда я компилирую, я получаю следующее:

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

Ответы

Ответ 1

Это точно, как это работает! Если вы посмотрите на сгенерированный код javascript, он добавит в качестве анонимной функции, которая принимает объект, "объект модуля":

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

Если вы посмотрите на последнюю строку (})(mylib || (mylib = {}));), вы увидите, что она создает новый ojbect (mylib = {}), только если существующая переменная имеет значение false (или что-то, что оценивается как false, как null). Таким образом, все "модули", которые называются одинаковыми, будут объединены с одним и тем же объектом.

Поэтому внутренние модули расширяют друг друга. Я должен отметить, что я не совсем понял, что происходит с вложенными модулями.

Обновление: ваш код работает для меня, если я не использую синтаксис вложенного модуля, но измените его на синтаксис точки. например:.

module mylib.gui {
}

вместо

module mylib {
    module gui {
    }
}

Я попытаюсь выяснить, почему это происходит, поскольку я прочитал спецификацию, оба пути должны быть равными.

Обновление: если вложенный ссылочный модуль отмечен как экспортированный, он работает:

module mylib {
    export module gui {
    }
}