在带有 RequireJS 的 TypeScript 中使用 JQuery 等 [重复]答案

【问题标题】：Using JQuery etc. in TypeScript with RequireJS [duplicate]在带有 RequireJS 的 TypeScript 中使用 JQuery 等 [重复]
【发布时间】：2013-01-09 14:43:06
【问题描述】：

可能重复：
How to require jquery via AMD in TypeScript

我在TypeScript 中创建了一个项目。我使用RequireJS。一切正常，直到我需要 JQuery...

这是我的文件结构：

如您所见，我在modules 文件夹中有jquery-1.8.d.ts 文件。 jQuery 的 .js 文件位于 lib 文件夹中。当我使用 RequireJS 的配置文件导入模块时：

/// <reference path="../modules/require.d.ts" />
/// <reference path="AppMain.ts" />

require.config({
    baseUrl: '../',
    paths: {
        jquery: 'lib/jquery-1.8.3'
    },
    shim: {
        jquery: {
            exports: '$'
        }
    },
    name: "app/AppMain",
    out: "../!built/Test.js",
    optimize: "none"
});

require(['jquery', 'app/AppMain',
],
    ($, main) => {
        var appMain = new main.AppMain();
        appMain.run();
    });

...然后将其导入JavaScript。如果我想把它放在TypeScript 里面怎么办？我需要使用JQuery、JQueryStatic 和JQueryPromise，在.d.ts 文件中声明。

当我尝试简单地导入一个新模块时，我得到一个错误：

import JQueryExternal = module("../../../modules/jquery-1.8.d"); // error: The name does not exist in the currect scope. A module cannot be aliased to a non-module type
interface Test {
    MyMethod(): JQueryPromise; // here's a sample usage
}

一开始我以为路径不对，但我尝试将其移到classes 文件夹中，然后以其他类的方式导入它。同样的错误：/

如何以我想要的方式在TypeScript 中使用jQuery？有可能吗？

【问题讨论】：

标签： javascript requirejs typescript

【解决方案1】：

这完全糊涂了：

import JQueryExternal = module("../../../modules/jquery-1.8.d");

您不会将定义文件作为模块导入以便在 TypeScript 中使用它。无论您是使用 AMD/RequireJS 还是 Node.js 样式的模块来导入最终代码，您始终以相同的方式在文档顶部引用 d.ts 定义文件：

/// <reference path="YOUR-RELATIVE-PATH-HERE/jquery.d.ts" />

这不会使库在 JavaScript 中可用，但它会使定义在您编写 TypeScript 时可用。

我正在开发一个与您类似的大型应用程序，它大量使用了 RequireJS 和 JQuery。我看不到将 JQuery 作为模块加载的任何好处。我只是导入引用（如上所述），并确保我的页面首先加载 JQuery（和任何其他库）：

<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jquery.ui/1.9.0/jquery-ui.min.js"></script>
... etc ...
<script type="text/javascript" src="/content/client/libs/require.js" data-main="/content/client/pe.framework"></script>

【讨论】：

我不得不说，我喜欢它的简单性，但是 requirejs 加载 .js 依赖项异步不是好处吗？（假设 web 客户端 js 应用）

【解决方案2】：

我在这两者配合得很好时遇到了一些问题，所以当我将 requireJS 与 JQuery 一起使用时，我使用了一个捆绑版本来加载它们。不过，我不知道打字稿，所以我不确定这会有多大帮助。

捆绑包链接：https://github.com/jrburke/require-jquery

【讨论】：