TypeScript:从模块创建全局变量



我们正在使用 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 -->

相关内容

  • 没有找到相关文章

最新更新