Question

作为Angular开发人员，我想摆脱Karma / Jasmine ，而改用Jest ，以便我可以快速测试应用程序而没有任何痛苦。不幸的是，我遇到了意外的问题。

在过去的几个小时中，我浏览了SERP顶部显示的所有这些教程：

这是我详细做的事情：

使用ng new my-application创建一个新的Angular应用程序。
更改目录：cd my-application。
运行npm start（ng serve）和npm test（ng test）来查看一切是否正常-正常。
使用npm install --save-dev jest jest-preset-angular @types/jest
将此添加到package.json：

{
  ...
  "jest": {
    "preset": "jest-preset-angular",
    "setupFilesAfterEnv": ["<rootDir>/src/setupJest.ts"]
  }
}

将package.json中的npm脚本更改为以下内容：

"test": "jest",
"test:watch": "jest --watch",

在文件夹src中创建具有以下内容的文件setupJest.ts：

import 'jest-preset-angular';

问题：
我现在运行npm test时，测试套件无法运行

File not found: <rootDir>/tsconfig.spec.json

我不知道该怎么办，因为上面的所有教程似乎都无法解决这个问题。
请帮帮我！

提前谢谢！

Answer 1

您为什么不尝试从brigbug中尝试Jest Schematic。我刚刚在过去几天（2019年11月）中完成了此操作，并且运行良好。您只需在VS Code中运行以下命令，原理图就可以处理所有事情：

ng add @briebug/jest-schematic

它删除了大部分茉莉花，但是如果您运行此命令，它将卸载几乎所有与茉莉花有关的东西。在迁移到玩笑大理石的过程中，我没有以即时通讯的方式卸载茉莉花大理石，但如果未包括任何内容，只需将其添加到列表中即可。

我相信它也错过了从tsconfig.spec.json文件中的类型中删除茉莉花的过程，因此我将其更新为以下内容：

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/spec",
    "module": "commonjs",
    "types": ["jest", "node"],
    "emitDecoratorMetadata": true,
    "allowJs": true
  },
  "files": ["polyfills.ts"],
  "include": ["**/*.spec.ts", "**/*.d.ts"]
}

我还必须更新package.json中新插入的jest部分的globals部分，并更改tsConfig值，将其添加到'/ src / ** / src / ** tsconfig.spec.json中，因为生成的点没有指向到我的/ src目录。

"globals": {
  "ts-jest": {
    "tsConfig": "<rootDir>/src/tsconfig.spec.json",
    "stringifyContentPathRegex": "\\.html$",
    "astTransformers": [
      "jest-preset-angular/build/InlineFilesTransformer",
      "jest-preset-angular/build/StripStylesTransformer"
    ]
  }

如何在2019年10月使用Jest设置Angular？

1 个答案: