javascript - 使用 AMD 将 jQuery 和其他第三方库作为模块导入 TypeScript

标签 javascript requirejs typescript amd

问题:有没有办法使用 AMD 支持(通过编译器)将 jquery 导入 TypeScript 模块,以便将 jquery 作为依赖项包含在内?

关键是获取import语句,它使模块成为define语句中的依赖项(见下文)。

define(["require", "exports", 'dataservice', 'jquery', 'knockout'], 
    function(require, exports, __ds__, $ , ko) { 
         ...
    }
)

详细信息: 我想将 jquery(和其他第 3 方库)作为 AMD 的 TypeScript 模块导入。目标是使它们在 require 列表中显示为依赖项。但是,使 TypeScript 执行此操作的唯一方法似乎是具有 import 语句。要进行导入,您需要导入一个模块。但是...没有要指向的 jquery 模块。 到。

解决方法:

  1. 我可以引用 main.js 中的 .d.ts 和预加载 jquery 以获取 require.js,但这意味着预加载所有第 3 方库。不可怕,但也不理想,因为它没有利用我们已经可以用 JavaScript 和 AMD 做的事情。
  2. 我可以为每个第 3 方库创建一个模块并将其包装起来,但随后我得到类似 $.$ 的东西。更糟糕的是,IMO(并且 Irisk 为其中的每一个编写了错误的模块代码并且不同步)。

所以现在我只是在 main.js 中预加载 jquery。但同样,但这并不理想。必须对任何没有模块的库(如 knockout、backbone 等)执行此操作。

有什么更好的建议或我遗漏的东西吗?

更新/澄清:

我还可以在配置中使用垫片来实现库之间的依赖关系。但这仍然会预加载第 3 方的。示例:

require.config({
    baseUrl: '../',
    paths: {
        'jquery': 'lib/jquery-1.7.2',
        'underscore': 'lib/underscore'
    }, 
    shim: {
        jquery: {
            exports: '$'
        },
        underscore: {
            exports: '_'
        }
    }
});

最佳答案

另一种解决方法是使用 requirejs 的类型定义并使用您自己的 require 语句,而不是 import 语句。

这样做的缺点是 TypeScript import 可以与 AMD 或 CommonJS 一起使用,只需更改编译器,因此与 导入

有一个现有的 definition for requirejs on Definitely Typed .

关于javascript - 使用 AMD 将 jQuery 和其他第三方库作为模块导入 TypeScript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14072914/

相关文章:

javascript - Firebase 快照返回对象而不是数组来迭代

javascript - iFrame 自动刷新不适用于 Chrome,但适用于 IE

javascript - 主干 View 不刷新事件

javascript - 要求 js 缓存设置 urlArgs 半身像的设置文件

angular - 无法读取 ionic 搜索栏中未定义错误的属性 'toLowerCase'?

reactjs - React Native,类型错误: undefined is not an object When it is

javascript - 可以修改此 Youtube 代码以强制自动播放吗?

javascript - 带下划线的 map 缩小对象

requirejs - typescript - 250 .ts 文件 - require(),//引用、模块等

angular - RxJs 扩展和延迟运算符未按预期工作