获取 nyc/istanbul 覆盖率报告以使用打字稿

Question

我正在努力为我的 typescript/mocha/gulp 项目获得 nyc/istanbul 的适当报道。我尝试了多种方法，其中一些方法似乎无法使用源映射，而另一些方法则由于 ts-node/tsc 错误而失败。我当前的设置是：

nyc package.json

中的相关配置

"scripts": {
    "test:coverage": "nyc npm run test:unit",
    "test:unit": "gulp mocha"
}
"nyc": {
    "check-coverage": true,
    "all": true,
    "extension": [
      ".js",
      ".jsx",
      ".ts",
      ".tsx"
    ],
    "include": [
      "src/**/!(*.test.*).[tj]s?(x)"
    ],
    "reporter": [
      "html",
      "lcov",
      "text",
      "text-summary"
    ],
    "report-dir": "docs/reports/coverage"
  }

gulpfile.js mocha 相关部分

const SRC_DIR = path.join(__dirname, 'src');
const SRC_FILES = path.join(SRC_DIR, '**', '*.[jt]s?(x)');
const TEST_FILES = path.join(SRC_DIR, '**', '*.test.[jt]s?(x)');
const MOCHA_CONFIG = {
    src: [
        TEST_FILES
    ],
    watchSrc: [
        SRC_FILES,
        TEST_FILES
    ],
    mocha: {
        // compilers: [
        //     'ts:ts-node/register',
        //     'tsx:ts-node/register'
        // ],
        require: [
            './tests/setup.js',
            'ignore-styles',
            'source-map-support/register'
        ]
    }
};
gulp.task('mocha', mocha(MOCHA_CONFIG));

tsconfig.json

{
  "compilerOptions": {
    "baseUrl": "./",
    "rootDir": "./src",
    "outDir": "./build",
    "allowJs": true,
    "module": "commonjs",
    "target": "es5",
    "lib": ["es5", "es6", "dom"],
    "sourceMap": true,
    "inlineSourceMap": false,
    "inlineSources": false,
    "experimentalDecorators": true,
    "noUnusedParameters": true,
    "noUnusedLocals": true,
    "jsx": "react",
    "moduleResolution": "node"
  },
  "exclude": [
    "docs",
    "tests",
    "**/*.test.js",
    "**/*.test.jsx",
    "**/*.test.ts",
    "**/*.test.tsx",
    "tools",
    "gulpfile.js",
    "node_modules",
    "build",
    "typings/main",
    "typings/main.d.ts"
  ],
  "awesomeTypescriptLoaderOptions": {
    "useCache": true,
    "useBabel": true
  }
}

通过上述设置，覆盖会为所有文件生成结果，但它们对于 TS 文件不正确，很可能是由于未使用源映射（即报告显示没有覆盖注释行，数字似乎是错误的）以及）。

尝试了多种变体方法但没有成功，其中最常见的建议之一是将 "require": ["ts-node/register"] 添加到 nyc 配置，然后我收到错误抱怨，即 gulpfile.js, docs/reports/coverage/lcov-report/prettify.js 和其他 JS 文件的数量 not under 'rootDir' 这是正确的但不清楚为什么 ts-node 试图处理 src 中的所有文件，即使它们被排除在 tsconfig.json 中（配置仍然非常复杂）。

对于获取 TS 文件的正确覆盖率报告的任何建议，我将不胜感激。

Answer 1

最近，我在 tsconfig.json 的 compilerOptions 中使用 "target": "es6" 而不是 es5 找到了一个令人满意的解决方案。虽然直接在 tsconfig.json 中更改 target 可能不是一个选项，因为它会影响构建，另一个提示是使用 TS_NODE_COMPILER_OPTIONS='{"target":"es6"} 可以直接在 package.json [=19= 中添加] 即：

"test:coverage": "TS_NODE_COMPILER_OPTIONS='{\"target\":\"es6\"}' nyc npm run test:unit",

其中 test:unit 是用于运行实际测试的任何方式（在我的例子中只是 gulp mocha.

注意：我还按照 https://github.com/istanbuljs/nyc/issues/618 线程

上的建议将 nyc 更新到最新的 11.1.0 并将 ts-node 更新到 3.3.0

Answer 2

我不确定这是同一个问题，但我会把它放在这里以防它对未来的开发人员有帮助...

在我将 exclude-after-remap=false 添加到我的 package.json.

的 nyc 部分之前，我没有得到任何覆盖率数据

已列出 in the documentation 但不是很显眼 (IMO)。

Answer 3

由于很多更改打破了旧的工作设置，我创建了一个详细的示例项目，涵盖 typescript + mocha + nyc 也支持对非调用文件的适当覆盖（这通常不包括在示例中）以及一些单元测试示例并使用最新版本进行质量检查。

我在去 mocha 8+ nyc 15+ 时遇到了几个问题。也许它也可以帮助其他人绊倒它。

https://github.com/Flowkap/typescript-node-template

如果您只对覆盖率感兴趣，请检查 .ncyrc.yml 和 mocharc.yml 以及 package.json 中的调用配置。 VsCode 还包括启动配置：

.nycrc.yml

extends: "@istanbuljs/nyc-config-typescript"

reporter:
  - html
  - lcovonly
  - clover
  # those 2 are for commandline outputs
  - text
  - text-summary
report-dir: coverage

.mocharc.yml

require:
  - ts-node/register
  - source-map-support/register
recursive: true
color: true
exit: true
extension:
  - ts
  - test.ts

在 package.json

测试作业

"test": "npm run lint && nyc mocha src test",

获取 nyc/istanbul 覆盖率报告以使用打字稿

getting nyc/istanbul coverage report to work with typescript

javascript

mocha.js

typescript

istanbul

tsconfig