如何在没有 <reference> 的情况下在 TypeScript 中导入带有“Typings”的模块？

Posted 2023-03-13

【中文标题】如何在没有 <reference> 的情况下在 TypeScript 中导入带有“Typings”的模块？

【英文标题】：How to import modules with ‘Typings’ in TypeScript without <reference>?

【发布时间】：2017-03-13 00:06:05

【问题描述】：

我正在尝试在 TypeScript 中使用 Protractor 和 Jasmine 编写测试。 TSD 现在已弃用，因此我必须使用“打字”来操作 TypeScript 定义。所以我安装了它：

npm install typings -g

然后我用它来安装 Jasmine 和 Chance 这样的定义：

typings install jasmine --source dt --save –-global
typings install chance--source dt --save –-global

我还添加了 “files” 部分并排除了“node_modules”：

// tsconfig.json

  "compilerOptions": 
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "declaration": false,
    "noImplicitAny": false,
    "outDir": "tmp",
    "types": ["node", "jasmine", "chance"]
  ,
  "files": [
    "typings/index.d.ts"
  ],
  "include": [
    "lib",
    "specs"
  ],
  "exclude": [
    "node_modules"
  ]

问题是 WebStorm 和 Visual Code studio 都找不到所有 Jasmine 方法和“机会”模块的定义。错误是：

**“TS2304: Cannot find name 'describe'”** 
**“TS2307: Cannot find module 'chance'”**

分别。这是我的规范文件：

在“typings/”文件夹中，我看到了 TypeScript 定义的参考链接：

我错过了什么吗？为什么我的 IDE 找不到 Jasmine 和 Chance 的定义？

P.S. 转译成 Javacript 后可以测试。

P.S.S.添加后错误会消失

///<reference path="###"/>

到规范文件。但我不想用它。

Protractor: 4.0.9;
TypeScript 2.0.3;
Typings 1.5.0;

提前致谢！

【参考方案1】：

有一些事情会妨碍您正常工作。首先，如果您使用的是 Typescript 2.0，那么 typings 也已被弃用。

Typescript 2.0 支持在 node 模块中打包类型（通常由 npm install @types/module-name 安装。在确定类型上可用的所有声明也可以作为“@types/*”命名空间下的 npm 模块使用，所以如果你想离开tsd，typings 不应该是你的最终目的地。

话虽如此，typescript 2.0 仍然可以处理类型，所以让我指出一些我在您的配置文件中看到的问题。

类型属性

 
    "types": ["node", "jasmine", "chance"]  

types, 属性仅用于@types/* 中基于 npm 包的新类型。由于您尚未使用此属性，因此您的 tsconfig.json 中不应包含此属性。 （有关此属性和相关属性的作用的完整讨论，请参阅 TypeScript 2: custom typings for untyped npm module。

文件/包含/排除属性

 "files": [
    "typings/index.d.ts"
  ],
  "include": [
    "lib",
    "specs"
  ],
  "exclude": [
    "node_modules"
  ]

虽然您可以选择同时使用这两个文件和包含属性，但这不是必需的。您可以将 files 数组中的 typings/index.d.ts 引用移动到 include array 中，然后删除 files。

此外，您遇到的最大问题是您的 include 语法错误。 include 采用 glob 模式。您不能只是简单地输入文件夹名称，而是需要遵循递归模式：

  "include": [
    "typings/index.d.ts",
    "lib/**/*",
    "specs/**/*"
  ],

最后一件事是您不需要排除node_modules。排除仅用于排除与您的包含模式匹配的内容。由于node_modules 不会与您的include 模式匹配，因此无需排除它。

我认为，如果您进行这些小的更改，事情应该会按您的预期工作，但是我真的会一直考虑并迁移到基于 @types/* 的新类型，因为它们更易于管理并且更多方便，不需要像打字或 tsd 这样的外部工具（npm 除外）。

【讨论】：

有一个很好的使用 TypeScript 的 Protractor 项目设置示例 (github.com/angular/protractor-cookbook/tree/master/…)。我也同意你应该使用 TypeScript 2.0...还有一个 @types/chance 已发布。

【参考方案2】：

您需要更新您的compilerOptions，如下所示：

  "compilerOptions": 
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "declaration": false,
    "noImplicitAny": false,
    "outDir": "tmp",
    "typeRoots": ["./typings"] // Updated!
  ,

typeRoots 自动在编译中包含指定文件夹下的所有定义文件，无需向相关文件添加引用指令，也无需创建索引文件（然后您需要随时更新您添加一个新的环境库）。

您当前的配置 ("types": ["node", "jasmine", "chance"]) 将仅搜索 node_modules/@types 中的定义文件，然后仅包括 node、jasmine 和 chance 定义。

这在tsconfig.json 文档中有详细说明。

编辑：您使用的是 JetBrains IDE。如果 IDE 正在为您编译 JS，请确保它使用您的 tsconfig.json 而不是它自己的设置。它在首选项中。