打字稿模块答案

【问题标题】：TypeScript modules打字稿模块
【发布时间】：2023-03-29 00:05:01
【问题描述】：

我想知道是否有可能以某种方式将两个或多个文件中的两个或多个类添加到 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

【问题讨论】：

是的，这是支持的。不知道您为什么不尝试一下。
我做到了。很抱歉没有解释我遇到的错误......将进一步描述。

标签： module typescript

【解决方案1】：

这正是它的工作原理！如果您查看生成的 javascript 代码，它会添加为接受对象的匿名函数，即“模块对象”：

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

如果您查看最后一行 (})(mylib || (mylib = {}));)，您会发现它仅在现有变量为 false（或评估为 false，如 null）的情况下实例化一个新的 ojbect (mylib = {})。这样，所有同名的“模块”都会合并到同一个对象中。

因此，内部模块相互扩展。我必须注意，我还没有完全弄清楚嵌套模块会发生什么。

更新：如果我不使用嵌套模块语法，您的代码对我有用，但将其更改为点语法。例如：

module mylib.gui {
}

而不是

module mylib {
    module gui {
    }
}

我将尝试调查为什么会发生这种情况，据我阅读规范，两种方式应该是平等的。

更新：如果嵌套引用的模块被标记为导出，它可以工作：

module mylib {
    export module gui {
    }
}

【讨论】：