如何让 WebStorm 识别 Jasmine 方法？答案

【问题标题】：How can I get WebStorm to recognize Jasmine methods?如何让 WebStorm 识别 Jasmine 方法？
【发布时间】：2021-09-25 23:40:58
【问题描述】：

我有一个 node.js 项目，其中包含一些 Jasmine 规范。根据jasmine-node 的要求，规范位于 spec/ 子目录中，并具有 .spec.coffee 扩展名。

当我在WebStorm IDE 中打开我的一个规范文件时，对beforeEach 和describe 和it 的所有调用都显示为带有蓝色波浪下划线和工具提示：“未解决的函数或方法它（ )”。因此，即使我使用的是 3.0 EAP 并且应该是 have some amount of Jasmine support，它也不会自动发现这是一个 Jasmine 规范文件。

我尝试进入 File > Settings > JavaScript Libraries，并将 Jasmine 添加为库（指定 jasmine-2.0.0.rc1.js 的路径），然后转到 Usage Scope 子页面并检查“Jasmine " 在“项目”旁边的下拉列表中，但这没有任何效果 - Jasmine 方法仍然显示为未解决。

我如何告诉 WebStorm 一个 spec 子目录中的所有文件和/或所有具有 .spec.coffee 扩展名的文件都是 Jasmine 测试，并让它识别这些测试正在使用的 Jasmine API？

【问题讨论】：

我在 3.0 EAP 中遇到了同样的问题。这就是我在 2.1.5 中工作的原因。
您应该将其作为问题提交至youtrack.jetbrains.net/issues/WI，以便开发人员可以在未来的版本中解决此类问题。
@Microfed，所以您是说 2.1.5 会自动识别 Jasmine 测试？这是一个已经写好的错误吗？

标签： jasmine webstorm

【解决方案1】：

您可以在 Webstorm/PHPStorm/Idea 中使用预定义的 JS 库存根

打开文件>设置...
选择语言和框架 > JavaScript > 库
点击下载...

切换到 TypeScript 社区存根
查找 karma-jasmine（最初名为 jasmine）（如果这不起作用，请改用 jasmine）
点击下载并安装

我在 Jasmine 2.0 中使用此设置

【讨论】：

它叫karma-jasmine，他们改变它只是为了帮助我们找到它
对我不起作用。 “describe”、“beforeEach”、“it”仍然带有灰色下划线。
如果你不使用 karma，你可以选择 'jasmine' 库进行下载。这就是尝试业力茉莉花后对我有用的方法
即使我使用的是 karma，我只需要下载 jasmine 就可以使用它。 karma-jasmine 没用。
最后一步 - 重启 IDE

【解决方案2】：

在带有 webstorm 2016.1.1 的 Mac 上，我执行了以下操作：

打开首选项（webstorm->preference 或 [command + ,]）
转到库和框架 -> javascript -> 库
下载
从列表中选择“茉莉花 - 绝对类型”

【讨论】：

它在 mac 上对我有用，但我需要关闭并重新启动 WebStorm。
我已经在 Windows 机器上使用 IntelliJ 2016.3 下载了 jasmine 库，并且它工作正常，即使没有重新启动。
我还必须将“类型”从全局更改为项目。安装后双击库名称，然后更改“可见性”设置

【解决方案3】：

注意，如果您在 WebStorm 中使用 JSHint 等代码质量工具，添加全局 jasmin/karma-jasmine 库并不能消除 JSHint 错误。

您需要通过 WebStorm 的菜单系统（Lang & Frameworks>JavaScript>Code Quality Tools>JSHint）访问 JSHint 设置，然后单击复选框以使其知道运行在哪个环境中。

【讨论】：

我的环境中缺少 Jasmine。它是如何出现在你的身上的？
@AseemBansal 你用的是什么版本的 jshint？
我使用的是 2.5.10 版本

【解决方案4】：

使用 TypeScript（和 Angular2），您只需在 WebStorm 设置中启用 TypeScript 编译器 ...

设置 > 语言和设置 > TypeScript ...

在编译器标题下打勾...

启用 TypeScript 编译器 ...

（我还点击了使用 tsconfig.json 单选）

现在可以识别 Jasmine 方法

【讨论】：

这个解决方案的问题是我不希望WebStorm 编译我的TypeScript，因为我使用的是Webpack。
有趣的是，如果我将new project 作为Angular CLI 项目，那么它会识别它们。我不确定有什么不同。
我使用 gulp 转译我的 TypeScript，如果您正确设置了 tsconfig.json，TypeScript 将不会生成输出文件，它只会在 IDE 中验证它们。
为我工作。不要忘记勾选 tsconfig.json
这对我来说几乎没有错误。但是，当我这样做时，我会从 WebStorm 中的 Typescript 编译器选项卡中得到此错误输出：错误：错误：解析 tsconfig 错误 [{"messageText":"Unknown compiler option 'baseUrl'.","category":1,"code ":5023},{"messageText":"未知编译器选项 'lib'。","category":1,"code":5023},{"messageText":"未知编译器选项 'typeRoots'。","category ":1,"code":5023}]

【解决方案5】：

这也可能是由于缺少依赖项造成的（如果您使用 TypeScript 进行开发）。

确保您已安装@types/jasmine

npm install --save-dev @types/jasmine

【讨论】：

【解决方案6】：

如果您在使用Angular CLI 生成项目后遇到此问题，请转到File -> Settings -> Languages & Frameworks -> JavaScript -> Libraries 并检查{your-project-name}/node_modules。

【讨论】：

【解决方案7】：

为了找到这个问题的答案，我在我的项目根目录上运行了DiffMerge，并在 Webstorm 中创建了一个新的 Angular CLI 项目，该项目正确地检测到了 jasmine 类型。

我发现我的项目中的tsconfig.json 和tsconfig.spec.json 文件定义了typeRoots 和types，而另一个项目没有。

typeRoots 选项的行为是：

如果指定了 typeRoots，则只包含 typeRoots 下的包。

Types 的行为方式类似。

Typescript 文档接着说：

默认情况下，所有可见的“@types”包都包含在您的编译中。任何封闭文件夹的 node_modules/@types 中的包都被认为是可见的。

所以，对于我的项目，这种行为对我来说已经足够好了。从我的tsconfig.json 和tsconfig.spec.json 文件中删除typeRoots 和types 解决了这个问题立即。

是的，茉莉花在tsconfig.spec.json 中的types 下声明。是的，它被设置为扩展tsconfig.json。

在这种情况下，没关系。有一天，它刚刚停止工作。可能是由于 Typescript 升级，但我不能肯定。如果有人知道为什么，请在下面发表评论，我很好奇。

【讨论】：