将过时的JavaScript库与更新的TypeScript集成
我和我的团队正在构建一个大型web应用程序项目,该项目使用较旧版本的流行JavaScript库(jQuery、主干、下划线等)。我们目前正在尝试分阶段使用TypeScript来提供新的解决方案以及替换现有的JavaScript代码。因为我们的项目在很大程度上依赖于特定的JS库版本(例如jQuery 1.8.3),所以将这些库更新到最新版本要比下载和删除最新版本稍微复杂一些 这给我们带来了一个分阶段使用打字脚本的问题;我们需要声明与最新TypeScript标准兼容的过时JS库版本。尽管在为客户提供声明文件方面做得很好 最新版本的JS库特定于最新版本的TypeScript,它不提供与最新TypeScript标准兼容的较旧JS库版本的声明文件 似乎随着TypeScript的增长,所有较旧的库声明(例如jQuery-1.8.3.d.ts)都被抛在了脑后,因为这些库正在同时进化。这是完全可以理解的,因为我不希望社区中有太多的努力来不断更新过时的库声明文件,以便它们与新的TypeScript标准兼容 因此,我的问题是:分阶段使用严重依赖旧JS库的新TypeScript代码的最佳方式是什么? 下面是我遇到的一个问题的例子。我实际上是在尝试使用TypeScript创建一个主干应用程序将过时的JavaScript库与更新的TypeScript集成,javascript,backbone.js,typescript,amd,Javascript,Backbone.js,Typescript,Amd,我和我的团队正在构建一个大型web应用程序项目,该项目使用较旧版本的流行JavaScript库(jQuery、主干、下划线等)。我们目前正在尝试分阶段使用TypeScript来提供新的解决方案以及替换现有的JavaScript代码。因为我们的项目在很大程度上依赖于特定的JS库版本(例如jQuery 1.8.3),所以将这些库更新到最新版本要比下载和删除最新版本稍微复杂一些 这给我们带来了一个分阶段使用打字脚本的问题;我们需要声明与最新TypeScript标准兼容的过时JS库版本。尽管在为客户提供
// Model.ts
import Backbone = require("backbone");
export class NewModel extends Backbone.Model {
...
}
由于我们将AMD与require.js一起使用,我们得到如下结果:
// Model.js
...
define(['require', 'exports', 'backbone'], function(require, exports, Backbone) {
...
}
// Model.js
...
define(['require', 'exports', 'backbone'], function(require, exports) {
var Backbone = require('backbone');
...
}
这很好,这正是我们想要的输出,因为我们的require.config文件定义了我们需要的所有库:
// Config.ts
require.config({
baseUrl: './',
paths: {
'jquery': '../jquery-1.8.3.min',
'underscore': '../underscore/underscore.min',
'backbone': '../backbone/backbone',
'text': '../require/text'
},
shim: {
jquery: {
exports: '$'
},
underscore: {
exports: '_'
},
backbone: {
deps: ['underscore', 'jquery'],
exports: 'Backbone'
}
}
});
但是,TypeScript不允许我们编译这段代码,除非我们有一个backbone.d.ts来描述backbone.js库的结构,并提供“backbone”模块的环境声明
// backbone.d.ts
declare module Backbone {
...
export class Model extends ModelBase {
...
}
...
}
declare module 'backbone' {
export = Backbone;
}
// Model.ts
/// <reference path="path/to/backbone.d.ts" />
import Backbone = require("backbone")
export class NewModel extends Backbone.Model {
...
}
这将产生以下结果:
// Model.js
...
define(['require', 'exports', 'backbone'], function(require, exports, Backbone) {
...
}
// Model.js
...
define(['require', 'exports', 'backbone'], function(require, exports) {
var Backbone = require('backbone');
...
}
这给了我们想要的Backbone
引用,但是TypeScript仍然抱怨,因为它不知道我们声明的Backbone
变量。换句话说,它不提供.d.ts文件提供的结构
尽管我们的.js文件与其关联的.d.ts文件之间缺乏相关性,但我们的大多数TypeScript解决方案实际上都能正常工作。我关心的是:将来这种差异会不会在我们的应用程序中造成重大问题?
目前,我能想到的最佳解决方案是:
我对这两种解决方案都不是特别兴奋,这就是为什么我要寻求另一种意见。如果还有人在这一点上与我在一起(很抱歉拖了这么久),那么我将感谢您提出的解决方案。这可能是一个棘手的问题,我们的团队在TypeScript的早期肯定解决了这一问题。最后,我们从明确输入的d.ts文件的版本开始,并根据我们的需要调整它们。对于许多库,我们发现键入没有使用新的语言功能,不完整,或者在某些情况下是完全错误的。我们已经尽了最大努力,在有意义的地方做出贡献 考虑到你正在考虑的两种方法,我同意1。当语言以极快的速度发展时,使d.ts文件与最新的TypeScript标准保持同步是一个更大的问题。虽然我仍然期望v2中会有很多新特性,但v1是相当稳定的。在运行到1.0的过程中,语言似乎每月都有变化。我认为我们现在不需要处理这种程度的客户流失:)