混合 TypeScript 和 Meteor - 跨多个文件的类

Question

对任何不正确的术语表示歉意。对于那些不熟悉 Meteor 的人，it has a well-defined order of script loading。我正在尝试创建许多包含类的 *.ts 文件，就像您在 C# 的 *.cs 文件中看到的那样。我想在彼此之间引用这些*.ts 文件，最终从main.ts 引用。

编译 Car.ts：

class Car {
   constructor(public age: number) { }
}

生成 Car.js：

var Car = (function () {
    function Car(age) {
        this.age = age;
    }
    return Car;
})();

使用 Meteor，我想要以下输出：

Car = (function () {
    function Car(age) {
        this.age = age;
    }
    return Car;
})();

这样就可以从另一个文件 main.ts 中引用 Car：

/// <reference path="car.ts"/>
Meteor.startup(function () {
    console.log(Car); // Hopefully prints [Function: Car]
    var a: Car = null; // Compiles
});

我可以通过修改 Car.ts 来接近：

declare var Car;

class Car_ {
   constructor(public age: number) {}
}

Car = Car_;

但这会产生一个笨拙的输出：

var Car_ = (function () {
    function Car_(age) {
        this.age = age;
    }
    return Car_;
})();
Car = Car_;

并且需要一个笨拙的 main.ts：

/// <reference path="car.ts"/>
Meteor.startup(function () {
    console.log(Car); // Prints [Function: Car_]
    var a: Car_ = new Car(); // Yuck!
});

有什么建议吗？我可能将其视为 C# 应用程序。

Answer 1

scrap TS 和 Meteor 无论如何都只会运行 .js 文件。

请改用https://atmospherejs.com/universe/modules。

Answer 2

我已经在 blog 和 here 上处理过这个问题。我决定使用邪恶的eval 命令，因为它给了我使用模块的最简单的可能性，直到出现更复杂的东西。

文件/lib/foo.ts。它位于子目录中，因为它必须在 Bar 之前加载，因为它正在扩展 Foo。

eval('var Hugo = (this.Hugo || (this.Hugo = {})'); // this will override the automatically emitted var Hugo and assigns it with globally defined Hugo module 

module Hugo {
  export class Foo {
    foo():string {
      return 'foo'
    }
  }
}

文件/bar.ts

/// <reference path="lib/foo.ts"/>
eval('var Hugo = (this.Hugo || (this.Hugo = {})'); // this will override the automatically emitted var Hugo and assigns it with globally defined Hugo module 

module Hugo {
 export class Bar extends Foo {
    bar () : string {
      return 'bar';
    }
  }
}

文件/test.ts

/// <reference path="lib/foo.ts"/>
/// <reference path="bar.ts"/>

var m = new Hugo.Bar();
console.log(m.bar());
console.log(m.foo());

如前所述，对于类，解决方案更加简单：

class ExportedClass {
    variable : int;
} 
this.ExportedClass = ExportedClass;

Answer 3

我昨天也遇到了同样的问题。 我正在使用 meteortypescript ，这给了我同样的问题（似乎它不允许与包一起正常工作）。

我切换到另一个编译器脚本，现在一切正常。 这里是：mologie:typescript, .

我没有寻找解决第一个问题的方法，但我偶然发现了两个编译器插件的作者之间的讨论，这可能解释了一些差异： https://github.com/mologie/meteor-typescript/issues/1

可能会有帮助

Answer 4

一种解决方案涉及设置全局对象：

class Car {
   constructor(public age: number) {}
}

global.Car = Car;

编译为：

var Car = (function () {
    function Car(age) {
        this.age = age;
    }
    return Car;
})();
global.Car = Car;

我对这个解决方案不太满意，因为global 是特定于 nodejs 的东西，在使用 window 的浏览器中不起作用。事实证明 this 在浏览器和服务器上都可以工作：

class Car {
   constructor(public age: number) {}
}

this.Car = Car;

编译为：

 var Car = (function () {
    function Car(age) {
        this.age = age;
    }
    return Car;
})();
this.Car = Car;

不优雅，但更好......

Answer 5

我可能将其视为 C# 应用程序。

是的。在这种特殊情况下，从 var Car 中删除 var 没有任何变化（两者都是全局的）。

以下将正常工作。只需将car.ts 移动到子文件夹中：

/// <reference path="./foo/car.ts"/>
Meteor.startup(function () {
    console.log(Car); // Hopefully prints [Function: Car]
    var a: Car = null; // Compiles
});