TypeScript:从模块创建全局变量

TypeScript: create global var from a module

本文关键字：创建 全局变量 模块 TypeScript      更新时间：2023-09-26

我们正在使用 TypeScript 更新我们的 Web 应用程序，现在我们遇到了这个问题。这是我们的静态类 MyModule.js：

MyModule = {};
MyModule.Constants = function(){};
MyModule.Constants.WIDTH = 100;
MyModule.Constants.HEIGHT = 100;
.......

现在我们把它改成这个，MyModule.ts：

module MyModule {
    export class Constants {
        public static WIDTH:number = 100;
        public static HEIGHT:number = 100;
        ....
    }
} 
export = MyModule;

这对我们来说很好用，使用 import/require 语句，但是有一些来自第三方的类（在 javascript 中）我们无法更改，并且它们无法访问 MyModule.Constants 静态属性，因为 MyModule 未定义它们。

那么有没有办法编码，使MyModule和MyModule.Constants是globar var？

假设您在浏览器中使用 AMD 模块：这里的难度取决于在处理脚本时是否必须为第三方代码定义 MyModule，或者在调用某个特定函数之前。

如果第三方脚本加载正常，那么您的"主要"require语句是唯一需要更改的内容。 （我主要是指 RequireJS 建议的单个入口点。 您需要做的就是将 MyModule 添加到依赖项列表中，并将其保存到全局对象中。

require(["MyModule", ...], function(MyModule, ...) {
    (<any>window).MyModule = MyModule;
    // the rest of your code
});

window被强制转换为此处的any，以便编译器不会抱怨该窗口。尚未定义我的模块。

如果您的第三方脚本在没有定义 MyModule 的情况下甚至无法加载，事情就会变得更加困难。 我认为最简单的解决方案是删除export = MyModule;行以使该脚本不是模块并单独/同步加载它。 所以你的HTML文件会有这样的内容：

    <script type="text/javascript" src="scripts/MyModule.js"></script>
    <script type="text/javascript" src="thirdpartylib.js"></script>
    <script type="text/javascript" data-main="scripts/main" src="requirejs.js"></script>
    <!-- etc -->
相关文章：