javascript - Angular 5 : adding types to external JS file

Question

我正在通过 <script src="http://.../script.js"> 加载一个 JS 文件

在 JS 中，有一个命名空间“foo”和一个方法“bar”。

我想调用foo.bar()来 self 的组件。

我想添加类型定义，这样我在编码时就知道我在做什么。我有文件 script.d.ts与类型定义。它看起来像这样:

export as namespace foo;

export namespace Baz {
    interface Qux {
    // ...
    }
}

export function bar(): Baz.Qux;

我不知道如何将此文件包含在 Angular 构建中(使用 CLI)，以便在构建期间进行类型检查，但在运行时将从我的组件调用外部 JS 文件中的命名空间和函数.帮忙？

Answer 1

您不需要 export 修饰符，因为它们不是从模块导出的，您可以使用 declare 并使用 /// 引用它们或包含定义在 tsconfig 中:

// script.d.ts
declare namespace foo {
    namespace Baz {
        interface Qux {
        // ...
        }
    }

    declare function bar(): Baz.Qux;
}

// Other file
/// <reference path="./script.d.ts" />
foo.bar() // works and calls method from remote JS file