javascript - 我如何使用 Gulp 使用 gulp-mocha 显示测试覆盖率

Question

请收下，我已经使用 gulp 作为任务运行程序将我的代码从 es6 转换为 es5。我已经完成了 Istanbul 尔的报道报告。设置后未显示测试覆盖率。下面是我的代码

import gulp from 'gulp';
import loadPlugins from 'gulp-load-plugins';
import path from 'path';
import mocha from 'gulp-mocha';
import exit from 'gulp-exit';
import coveralls from 'gulp-coveralls';
import cover from 'gulp-coverage';

将 gulp 插件加载到 plugins 变量中

const plugins = loadPlugins();

gulp.task('tests', () => {
  gulp.src('./server/tests/*.js')
    .pipe(plugins.babel())
    .pipe(mocha())
    .pipe(exit());
 });

将所有 Babel Javascript 编译成 ES5 并放置在 dist 文件夹中

const paths = {
  js: ['./**/*.js', '!dist/**', '!node_modules/**']
};

将所有 Babel Javascript 编译成 ES5 并放入 dist 目录

gulp.task('babel', () =>
  gulp.src(paths.js, { base: '.' })
    .pipe(plugins.babel())
    .pipe(gulp.dest('dist'))
);

gulp.task('coverage', () => {
  gulp.src('server/test/**/*.js', { read: false })
    .pipe(cover.instrument({
     pattern: ['server/controllers/**/*.js'],
      debugDirectory: 'debug'
    }))
    .pipe(mocha())
    .pipe(cover.gather())
    .pipe(cover.format())
    .pipe(gulp.dest('reports'));
 });

gulp.task('coveralls', () => gulp.src('./coverage/lcov')
    .pipe(coveralls()));

每次修改文件后重启服务器

  gulp.task('nodemon', ['babel'], () =>
    plugins.nodemon({
    script: path.join('dist', 'index.js'),
    ignore: ['README.md', 'node_modules/**/*.js', 'dist/**/*.js'],
    ext: 'js',
    tasks: ['babel']
  })
);

gulp.task('test', ['tests']);
gulp.task('default', ['nodemon']);
gulp.task('production', ['babel']);

Answer 1

以下片段介绍了我如何通过一点修改解决这个问题。

将以下代码放入你的gulpfile

import gulp from 'gulp';
import loadPlugins from 'gulp-load-plugins';
import path from 'path';
import shell from 'gulp-shell';

// Load the gulp plugins into the `plugins` variable
const plugins = loadPlugins();

// Compile all Babel Javascript into ES5 and place in dist folder
const paths = {
  js: ['./**/*.js', '!dist/**', '!node_modules/**', 
  '!./server/tests/**']
};

// Compile all Babel Javascript into ES5 and put it into the dist dir
gulp.task('babel', () =>
  gulp.src(paths.js, { base: '.' })
    .pipe(plugins.babel())
    .pipe(gulp.dest('dist'))
);

gulp.task('migrate', shell.task([
  'cross-env NODE_ENV=test sequelize db:migrate',
]));

gulp.task('coverage', shell.task([
  'cross-env NODE_ENV=test nyc mocha ./server/test/**/*.js',
]));

// Restart server with on every changes made to file
gulp.task('nodemon', ['babel'], () =>
  plugins.nodemon({
    script: path.join('dist', 'index.js'),
    ignore: ['README.md', 'node_modules/**/*.js', 'dist/**/*.js'],
    ext: 'js',
    tasks: ['babel']
  })
);

gulp.task('test', ['migrate', 'coverage']);
gulp.task('default', ['nodemon']);
gulp.task('production', ['babel']);

然后转到您的 package.json 然后添加以下内容

"nyc": {
    "require": [
      "babel-register"
    ],
    "reporter": [
      "lcov",
      "text",
      "html"
    ],
    "sourceMap": false,
    "instrument": false,
    "exclude": [
      "the test file you want to exclude from coverage"
    ]
  }

绝对完成