如何在 Ionic 2 TypeScript 项目中包含外部 Javascript 库?

How to include external Javascript library in an Ionic 2 TypeScript project?

我使用 Ionic 2、Angular 2 和 TypeScript 构建了一个 Ionic 项目来稍微测试一下框架。我需要在我的项目中包含一个外部库 (ntc.js),因为我需要它来命名十六进制颜色。

我知道在 TypeScript 中包含一个 Javascript 库应该可以工作,因为在 JS 中工作的任何东西在 TS 中工作。我只是不想以错误的方式包含它。

我试图将库添加到 www/build/js,但它似乎不起作用,而且似乎不是执行此操作的好方法。我试图寻找方法来做到这一点,但一无所获(可能是因为 Angular 2 和 Ionic 2 还很新鲜)。

诸如此类的事情:

import * as ntc from '../../js/ntc';

似乎效果不佳,即使我的图书馆位于正确的位置。 TypeScript 似乎无法正确读取我的文件,如果它能读取的话。

这样做的好方法是什么?我应该将 .js 文件放在项目目录中的什么位置?

您可以像任何其他常规 javascript 文件一样将其添加到您的 index.html 来导入它。

然后在你的 ts 文件中:

declare var Tree:any; 

然后在您的代码中,您可以使用 Tree 变量,尽管它存在于 Javascript 文件中。这行代码基本上是在告诉打字稿编译器那里有一个它应该忽略的变量树。

除了声明 var 告诉 ts 变量存在之外,您还可以使用 typescript 的类型。 通过写作

typings install libraryname

在您的控制台中,您会得到一个已经声明 var/class 的文件,您可以在导入它时看到它的所有 functions/properties。

import {lib} from 'libraryname';