如何在Angular 2 / Typescript应用程序中使用第三方js库？

Question

我试图在Angular 2 / Typescript应用程序中使用第三方.js库。 网上有一些例子（比如使用declare var libraryVar：any;）但似乎没什么用。 是否有一种正确的方法将.js库集成到Typescript / Angular2中？

Answer 1

网上有一些例子（比如使用declare var libraryVar：any;）但似乎没什么用。 是否有一种正确的方法将.js库集成到Typescript / Angular2中

也许你忘了把declare var libraryVar:any; 在vendor.d.ts文件中没有根级别导入/导出 。

Answer 2

Web上充满了使用第三方库的打字稿项目的示例。

这是我的一个使用arcgis-js-api。

这是一个使用openlayers的人。

在你的情况下你会尝试这个：

bower init
bower install node-uuid --save
tsd install uuid --save

然后设置您的tsconfig.json文件。 我认为Angular 2使用systemjs所以你想要设置module =“system”（参见系统），除非你有理由不这样做。

我对systemjs没有太多运气，但你可能需要这样做才能让它加载uuid或任何其他AMD模块：

window.define = System.amdDefine;
window.require = System.amdRequire;

有关说明，请参阅system-api 。

Answer 3

我发现使用外部库的最好方法是在打字稿的顶部为它创建一个变量并导入js。 通过这样做，变量将提供库中提供的所有函数，而无需任何额外的工作。

例如，如果你想使用moment.js做一些时间计算。 将其添加到您的ts文件中

var moment = require("./scripts/moment");

之后，您可以直接使用变量来使用打字稿中的函数

moment.fromNow("SOMEDATE");

几天前我遇到了确切的问题，我看到这是一个很好的选择，另一个简洁的方法是创建一个包含所有帮助程序的typescript类，并将typescript引用到您的文件中并调用其中的帮助程序。 仍在尝试实体模式，但这将是起点。