你如何使用带有 AMD 模块的打字稿内部模块

Question

我不确定我的打字稿结构是否不正确，所以可能在这里问错了问题。

我在同一个文件夹的不同文件中有 2 个相关的 classes 1 接口。

我将它们包装在一个模块中，因为这感觉就像我应该从 C# 中做的那样。

这就是所有 angularjs，所以它有自己的 DI，这可能很重要，但可能并不重要。

文件 1：

export module Module1{
    export interface IService{
    }
}

文件 2：

export module Module1{
    export class Implementation implements IInterface{
    ...
    }
}

文件 3 是 angular 使用 IInterface 注入实例的 angular 代码。如果我使用 require("./File2") 导入 File2 它可以工作，但我宁愿导入整个 Module1，如下所示，所以我不必单独要求每个 class（因为这是显然是一个简化的案例）。

import authModule = require('Module1');

var assetStreamApp = angular.module("[])
    .run(['IInterface'], (instance: IInterface) => {
        instance.doSomething();
    });

这可能吗？

我不想单独导入每个文件，然后为每个 "module" 选择不同的别名来为类型命名，我觉得我应该能够这样做一次。

编辑：经过更多的阅读，我想我已经掌握了一些术语。我想在项目中使用 typescript 内部模块，但也使用 AMD 模块作为拆分点，所以我可以使用 webpack 的代码拆分。

Answer 1

理想情况下，您应该只使用外部模块，而不是将内部模块与外部模块混合使用。

这个已经详细讨论过了 and here。

我建议做... IService.ts:

interface IService {
}

export = IService;

Implementation.ts:

import IInterface = require("./IInterface");

class Implementation implements IInterface{
...
}

export = Implementation;

然后将它们适当地导入到您的文件中：

import IService = require("./IService");
import Implementation = require("./Implementation");

// use IService and Implementation here

将多个模块合并为一个模块

话虽这么说，如果你真的想要，你可以使用上面的 IService.ts 和 Implementation.ts，然后创建一个名为 Module1.ts 的文件，你可以在其中导入然后导出你的模块，就像这样:

export import IService = require("./IService");
export import Implementation = require("./Implementation");

然后在你的代码中你可以像这样使用它：

import Module1 = require("./Module1");

// use Module1.IService or Module1.Implementation here

将多个模块与 ES6 模块组合

顺便说一下，如果你使用 ES6 模块，这样做会很方便...

IService.ts:

interface IService {
}

export default IService;

Implementation.ts:

import IInterface from "./IInterface";

export default class Implementation implements IInterface {
...
}

Module1.ts:

// re-export the modules
export {default as IService} from "./IService";
export {default as Implementation} from "./Implementation";

然后当你使用这个模块时，你可以很容易地访问你想要的东西。以下是一些示例导入语句：

// import only IService
import {IService} from "./Module1";
// import IService and Implementation
import {IService, Implementation} from "./Module1";
// or implement everything on a Module1 object
import * as Module1 from "./Module1";

你如何使用带有 AMD 模块的打字稿内部模块

How do you use typescript internal modules with AMD modules

typescript

amd

webpack