将 Meteor.js 中的模块与 Typescript 结合使用

问题描述

伙计们，我正在尝试做一些我认为应该很简单的事情，但我一定是做错了什么.我试图在我的使用 Typescript 的流星应用程序中简单地有一个清晰的结构.

这是我的要求:

• 所有接口在客户端和服务器端均可用
• 某些类实现仅在服务器上可用
• 我不想依赖文件加载顺序来让我的应用程序正常运行
• 我需要自己的模块不与全局对象(例如 Position 类)发生冲突
• 我需要有一个用于服务器的整体包含文件，一个用于客户端和服务器，一个用于客户端(不想在我的文件顶部包含 10 个包含文件)

我现在的设置是这样的

• 服务器
  • server-book.ts
• 客户
• 共享
  • collections.ts
• 定义
  • 服务器
    • include.d.ts(包括此文件夹中的所有 .d.ts 文件)
    • server-book.d.ts(书的服务器特定实现)
  • 客户
  • 共享
    • include.d.ts(此处包含所有 .d.ts 文件)
    • book.d.ts(书籍接口定义)
    • collections.d.ts

在我拥有的每个 .d.ts 文件中

模块我的模块{接口 Bla {}};

在定义一个类的每个 .ts 文件中:

模块我的模块{导出类 MyBla 实现了 Bla {}；}

为类生成的所有 .d.ts 文件都是通过 tsc -d 生成的.

未通过/// 包含 .ts 文件；而只是 .d.ts 文件.

现在，当我运行它时，我收到一个错误，即 MyModule 未定义:

///<reference path="shared/include.d.ts"/>///<reference path="server/include.d.ts"/>Meteor.startup(() => {var temp = new MyModule.ServerBook();});

错误发生在 MyModule 上.

我做错了什么?这里的正确设置应该是什么?

谢谢！

解决方案

我已经在我的 博客.我决定使用邪恶的 eval 命令，因为它给了我使用模块的最简单的可能性，直到出现更复杂的东西.

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

eval('var Hugo = (this.Hugo || (this.Hugo = {})');//这将覆盖自动发出的 var Hugo 并将其分配给全局定义的 Hugo 模块模块雨果{出口类 Foo {foo():string {返回 '​​foo'}}}

文件 /bar.ts

///eval('var Hugo = (this.Hugo || (this.Hugo = {})');//这将覆盖自动发出的 var Hugo 并将其分配给全局定义的 Hugo 模块模块雨果{导出类 Bar 扩展 Foo {酒吧():字符串{返回酒吧"；}}}

文件/test.ts

//////<reference path="bar.ts"/>var m = new Hugo.Bar();console.log(m.bar());console.log(m.foo());

如前所述此处，对于类，解决方案更简单:

class ExportedClass {变量:int；}this.ExportedClass = ExportedClass;

Folks, I'm trying to do something that I thought ought to be simple, but I must be doing something wrong. I'm trying to simply have a clear structure in my meteor application which uses Typescript.

Here are my requirements:

• All interfaces are available in both client and server
• Some class implementations are only available on the server
• I don't want to rely on file load order for my application to work properly
• I need my own module to not clash with global objects (such as the Position class for example)
• I need to have one monolithic include file for server, one for both client and server and one for client (don't want to have 10s of includes on top of my files)

The setup that I have right now is this

• server
  • server-book.ts
• client
• shared
  • collections.ts
• definitions
  • server
    • include.d.ts (includes all .d.ts files in this folder)
    • server-book.d.ts (server specific implementation of book)
  • client
  • shared
    • include.d.ts (includes all .d.ts files here)
    • book.d.ts (book interface definition)
    • collections.d.ts

In each .d.ts file I have

module MyModule {
     interface Bla {}
};

In each .ts file that defines a class I have:

module MyModule {
     export class MyBla implements Bla {};
}

All .d.ts files generated for classes are generated by tsc -d.

No .ts files are being included via ///<reference> rather only .d.ts files.

Now, when I run this, I get an error that MyModule is undefined:

/// <reference path="shared/include.d.ts"/>
/// <reference path="server/include.d.ts"/>
Meteor.startup(() => {
   var temp = new MyModule.ServerBook();
});

The error occurs right on MyModule.

What am I doing wrong? What should be the proper setup here?

Thanks!

解决方案

I have dealt with this issue on my blog. I decided to use the evil eval command, since it gave me the easiest possibility of using modules till something more sophisticated appears.

File /lib/foo.ts is position in the subdirectory since it has to be loaded before Bar.

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'
    }
  }
}

File /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';
    }
  }
}

File /test.ts

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

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

As mentioned here, for classes, the solution is even simpler:

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

这篇关于将 Meteor.js 中的模块与 Typescript 结合使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！