Angular 2 和 jQuery - 如何测试？

Question

我在 Angular 2 项目中使用 Angular-CLI（webpack 版本），并且还需要使用 jQuery（遗憾的是。就我而言，它是 Semantic-UI 的依赖项，我用它来处理菜单下拉菜单）。

我的使用方式：

npm install jquery --save

然后在

angular-cli.json

数组中列出

scripts

文件：

scripts": [
  "../node_modules/jquery/dist/jquery.min.js"
]

因此它被包含到捆绑文件中，并且该文件自动用于根 html 文件：

<script type="text/javascript" src="scripts.bundle.js">

然后

declare var $: any;

在我需要的文件中，效果很好。

但是

ng test

测试存在问题，因为 Karma 会抛出错误

$ is not defined

。

Answer 1

这是因为 Karma 提供的测试 html 文件不包含正常提供的版本中的

scripts.bundle.js

文件。

解决方案很简单；您只需将 jquery 文件的相同路径包含到项目根文件夹中的

karma.config.js

文件中即可。该文件位于项目的根目录中。

在

files

数组中，添加带有

watched

标志的路径，如下所示：

files: [
  { pattern: './node_modules/jquery/dist/jquery.min.js', watched: false },    
  { pattern: './src/test.ts', watched: false }
]

Karma 现在应该了解 jQuery 依赖项。

Answer 2

我正在使用 Angular 14，我已经更新了 karma.config.js 文件，但我认为不起作用，你能否给出代码示例，我如何才能确认 jquery 在规范文件中工作并增加覆盖范围