Angular4如何启用测试覆盖率

我正在尝试设置代码覆盖率.我创建了一个非常简单的小应用程序.

我读了我能找到的每一个可能的页面,但我迷失了.

如何在Angular4中设置代码覆盖率？

UPDATE2：
我现在决定使用业力报道记者
https://www.npmjs.com/package/karma-coverage
因此根据描述重写了业力配置文件.

包json更新到了.

我现在看到正在生成的文件夹,但HTML文件显示一个空表,

测试正在运行并通过：

这是我的包json.

{
  "name": "angular2-webpack","version": "0.0.1","description": "A webpack starter for Angular","scripts": {
      "pretest": "npm run lint","start": "webpack-dev-server --inline --progress --port 8080","test": "karma start","build": "rimraf dist && webpack --config config/webpack.prod.js --progress --profile --bail","lint": "tslint --force "src/**/*.ts""
  },"license": "MIT","dependencies": {
        "@angular/common": "4.1.2","@angular/compiler": "4.1.2","@angular/core": "4.1.2","@angular/forms": "4.1.2","@angular/http": "4.1.2","@angular/platform-browser": "4.1.2","@angular/platform-browser-dynamic": "4.1.2","@angular/router": "4.1.2","bootstrap": "^3.3.7","core-js": "2.4.1","es6-shim": "^0.35.3","jquery": "^3.2.0","reflect-metadata": "^0.1.10","rxjs": "^5.0.1","zone.js": "^0.8.10"
  },"devDependencies": {
      "@types/jasmine": "2.5.47","@types/node": "^7.0.18","angular2-template-loader": "^0.6.0","awesome-typescript-loader": "^3.0.4","css-loader": "^0.28.1","extract-text-webpack-plugin": "^2.1.0","file-loader": "^0.11.1","html-loader": "^0.4.3","html-webpack-plugin": "^2.16.1","jasmine-core": "^2.4.1","karma": "^1.7.0","karma-chrome-launcher": "^2.0.0","karma-coverage": "^1.1.1","karma-jasmine": "^1.0.2","karma-phantomjs-launcher": "^1.0.4","karma-sourcemap-loader": "^0.3.7","karma-webpack": "^2.0.1","lint": "^1.1.2","node-sass": "^4.5.0","null-loader": "^0.1.1","phantomjs-prebuilt": "^2.1.7","raw-loader": "^0.5.1","rimraf": "^2.5.2","sass-loader": "^6.0.3","style-loader": "^0.17.0","tslint": "^5.2.0","tslint-loader": "^3.5.3","typescript": "~2.3.2","webpack": "^2.2.1","webpack-dev-server": "2.4.5","webpack-merge": "^4.1.0"
  }
}

接下来是我的webpack配置

var webpack = require('webpack');
var helpers = require('./helpers');
const ExtractTextPlugin = require("extract-text-webpack-plugin");

const extractSass = new ExtractTextPlugin({
    filename: "[name].[contenthash].css",disable: process.env.NODE_ENV === "development"
});


module.exports = {
    devtool: 'inline-source-map',resolve: {
        extensions: ['.ts','.js']
    },module: {
        rules: [
            {
                test: /.ts$/,loaders: [
                    {
                        loader: 'awesome-typescript-loader',options: {configFileName: helpers.root('src','tsconfig.json')}
                    },'angular2-template-loader'
                ]
            },{
                test: /.html$/,loader: 'html-loader'
            },{
                test: /.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,loader: 'file-loader?name=assets/[name].[hash].[ext]'
            },{
                test: /.css$/,exclude: helpers.root('src','app'),loader: 'style-loader!css-loader?sourceMap'
            },include: helpers.root('src',loader: 'raw-loader'
            },{
                test: /.scss$/,use: extractSass.extract({
                    use: [{
                        loader: "css-loader"
                    },{
                        loader: "sass-loader"
                    }],// use style-loader in development
                    fallback: "style-loader"
                })
            },loader: 'raw-loader'
            }
        ]
    },plugins: [
        extractSass,new webpack.ContextReplacementPlugin(
            // The (|/) piece accounts for path separators in *nix and Windows
            /angular(|/)core(|/)(esm(|/)src|src)(|/)linker/,helpers.root('./src'),// location of your src
            {} // a map of your routes
        )
    ]
}

其次是现在更新的业力配置文件：

var webpackConfig = require('./webpack.test');
var path = require('path');

var ENV = process.env.npm_lifecycle_event;
var isTestWatch = ENV === 'test-watch';
module.exports = function (config) {
    var _config = {
        basePath: './',frameworks: ['jasmine'],files: [
            {pattern: './config/karma-test-shim.js',watched: false},'../src/**/*.js'
        ],// list of files to exclude
        exclude: [],preprocessors: {
            './config/karma-test-shim.js': ['webpack','sourcemap'],'../src/**/*.js': ['coverage']

        },coverageReporter: {
            type : 'html',dir : 'cover/'
        },webpack: webpackConfig,webpackMiddleware: {
            stats: 'errors-only'
        },webpackServer: {
            noInfo: true
        },reporters: ['progress','mocha','coverage'],port: 9876,colors: true,logLevel: config.LOG_INFO,autoWatch: false,browsers: isTestWatch ? ['PhantomJS'] : ['PhantomJS'],singleRun: true
    };

     config.set(_config);

};

完整荣耀的代码可以在这里找到

https://github.com/uweDuesing/angular2-webpack-template