如何在typescript文件中导入没有定义文件的js库

时间:2014-04-03 15:33:57

标签: javascript requirejs typescript

我希望从JavaScript切换到TypeScript,以帮助我们的项目变得更大的代码管理。然而,我们使用许多库作为amd模块,我们不想将其转换为TypeScript。

我们仍希望将它们导入TypeScript文件,但我们也不想生成定义文件。我们怎样才能做到这一点?

e.g。新的Typescript文件:

/// <reference path="../../../../definetelyTyped/jquery.d.ts" />
/// <reference path="../../../../definetelyTyped/require.d.ts" />
import $ = require('jquery');
import alert = require('lib/errorInfoHandler');

此处,lib/errorInfoHandler是一个amd模块,包含在我们不想触及的巨大JavaScript库中。

使用上面的代码会产生以下错误:

Unable to resolve external module ''lib/errorInfoHandler'' 
Module cannot be aliased to a non-module type.

这实际上应该产生以下代码:

define(["require", "exports", "jquery", "lib/errorInfoHandler"], function(require, exports, $, alert) {
...

}

有没有办法将JavaScript库作为amd模块导入TypeScript并在TypeScript文件中使用它而不需要定义文件?

5 个答案:

答案 0 :(得分:24)

这里给出的2个答案的组合对我有用。

//errorInfoHandler.d.ts
declare module "lib/errorInfoHandler" {
   var noTypeInfoYet: any; // any var name here really
   export = noTypeInfoYet;
}

我仍然是TypeScript的新手,但看起来这只是一种告诉TypeScript通过导出虚拟变量而没有类型信息的方法。

修改

在这个答案的评论中已经注意到,您可以通过简单地声明来实现相同的结果:

//errorInfoHandler.d.ts
declare module "*";

请参阅github评论here

答案 1 :(得分:4)

使用以下内容创建您自己的定义文件:

declare module "lib/errorInfoHandler" {}

并在此处引用您要使用导入的文件。

或者将以下行添加到文件顶部:

/// <amd-dependency path="lib/errorInfoHandler">

注意:我不知道后者是否仍然有效,这是我最初使用缺少的AMD依赖项的方式。另请注意,使用此方法,您将无法获得该文件的IntelliSense。

答案 2 :(得分:1)

在名为lib的{​​{1}}中创建一个文件。写下:

errorInfoHandler.d.ts

现在,var noTypeInfoYet: any; // any var name here really export = noTypeInfoYet; 导入将成功,并且类型为alert

答案 3 :(得分:0)

通常,如果您只需要一个更快的解决方案,可以通过在项目文件夹的根目录中定义一个新的index.d.ts来完成,然后指定一个模块名称如package.json文件中所述

例如

// somefile.ts
import Foo from '@awesome/my-module'

// index.d.ts on @awesome/my-module
declare module '@awesome/my-module' {
  const bind: any;
  export default bind;
}

答案 4 :(得分:0)

在2020年遇到这个问题,并找到了一个简单的解决方案:

  1. 在TS项目的根目录中创建一个 decs.d.ts 文件。

  2. 放置此声明:

    declare module 'lib/errorInfoHandler';
    

这消除了我的情况下的错误。我正在使用TypeScript 3.9.7

相关问题