使用 TypeScript 和 JSPM 导入 JQuery

Question

我有一个使用 JSPM 的项目。 我正在使用 FoundationJS，它又需要 JQuery.

我是这样导入 JQuery 的：

import jQuery from 'jquery';

然后像这样使用它：

jQuery(document).foundation();

一切都很好 - JQuery 是从 JSPM 导入的。

但是我后来决定改用 TypeScript。

TypeScript 出现错误“

cannot find module 'jquery'

如何在 TypeScript 中导入此 JSPM 模块？ 我也在使用 SystemJS...但我不确定这是否有帮助！

Answer 1

在 typescript 中使用 javascript 库（如 jQuery 和 FoundationJS）时，您只需为 typescript 提供足够的信息来对您的代码进行类型检查。

这通常是通过将 type declarations for javascript 库与要由 typescript 编译的源文件一起包含来完成的。

对于 typescript 2.0，您可以在 @types npm 前缀下找到 jQuery 和 FoundationJS 的类型声明：

npm install @types/foundation

将在 node_modules/@types 中安装 FoundationJS 及其依赖项 jQuery 的声明，打字稿编译器会自动找到它。

但是这些声明的编写方式与您导入的方式不兼容jQuery。看起来您必须更改导入以使用与 es6 之前的模块兼容的特定于打字稿的语法：

import jQuery = require('jquery');

然后编译。那么您可能必须选择合适的模块格式（在 compiler options 中查找 --module）。 Typescript 默认生成 CommonJS，这对于 SystemJS 应该不是问题（使用 es6 模块格式被 import ... = require 语法排除）。

另一个可能的问题可能是来自 @types 的声明针对不同版本的 jQuery 或 FoundationJS，它与您在 运行 时使用的实际版本不兼容 -那么你必须在其他地方找到正确的声明或自己写。