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

Question

随着我们的项目越来越庞大，我希望从JavaScript切换到TypeScript来帮助管理代码。然而，我们使用了许多amd模块作为库，我们不想将它们转换为TypeScript。

我们仍然希望将它们导入到TypeScript文件中，但我们也不想生成定义文件。我们该如何实现这一点？

例如，新的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文件内使用它，而不必创建一个定义文件？

- tune2fs

Answer 1

这里给出的两个答案的组合对我起了作用。

//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 评论 此处。

- Pure Function

---

你可以跳过declare module这一部分，只需要在var之前加上declare即可。 - drodsou

根据 GitHub 上的这个评论，declare module "*" 就足够了。 - gronostaj

是的 - 只需使用@gronostaj提供的这个最小声明。 - Freewalker

请注意，'declare module "module-name";'将允许仅此模块没有类型，而'*'将声明所有模块具有更多的类型。 我们更喜欢前者，因为然后我们可以逐个确定哪些模块没有类型。 - Freewalker

Answer 2

要么创建自己的定义文件，内容如下：

declare module "lib/errorInfoHandler" {}

在你需要引用导入的地方，引用该文件。

或者在你的文件顶部添加以下行：

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

注意：我不确定后面的方法是否仍然有效，这是我最初处理缺少AMD依赖关系的方式。请注意，使用此方法，您将无法在该文件中使用IntelliSense。

- thomaux

Answer 3

在lib文件夹中创建一个名为errorInfoHandler.d.ts的文件，然后在该文件中编写以下内容：

var noTypeInfoYet: any; // any var name here really
export = noTypeInfoYet;

现在，alert 导入将会成功，并且类型为 any。

- Ryan Cavanaugh

---

谢谢提供的信息。然而，它仍然抛出错误“无法解析外部模块”。我需要在导入require语句中添加什么路径和扩展名的js文件？ - tune2fs

第一行需要在 var 前加上 declare 才能正常运行。 - drodsou

Answer 4

如何尝试忽略 TypeScript 错误，就像这样

// @ts-ignore
import alert = require('lib/errorInfoHandler');

- morteza deris

Answer 5

在2020年遇到了那个问题，找到了一个简单的解决方案：

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

2. 放置以下声明：

   declare module 'lib/errorInfoHandler';
   

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

- i.brod

Answer 6

通常，如果您只需要一个临时的快速解决方案，可以通过在项目文件夹的根目录中定义一个新的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;
}

- Aditya Kresna Permana