错误:找不到Angular2、Karma、Webpack和伊斯坦布尔的源地图

Question

我试图使用TypeScript插件生成karma-remap-istanbul文件的覆盖率报告。

业力成功地执行了我的测试用例，但是当业力重新映射-伊斯坦布尔试图生成覆盖报告时，它会抛出以下错误：

Error: Could not find source map for: "E:\myapp\karma-test-shim.js"
    at E:\myapp\node_modules\remap-istanbul\lib\remap.js:257:11
    at Array.forEach (native)
    at E:\myapp\node_modules\remap-istanbul\lib\remap.js:214:22
    at Array.forEach (native)
    at remap (E:\myapp\node_modules\remap-istanbul\lib\remap.js:213:12)
    at RemapCoverageReporter.onCoverageComplete (E:\myapp\node_modules\karma-remap-coverage\remap-covera
s:23:23)
    at Server.<anonymous> (E:\myapp\node_modules\karma\lib\events.js:13:22)
    at emitTwo (events.js:106:13)
    at Server.emit (events.js:191:7)
    at InMemoryReport.writeReport (E:\myapp\node_modules\karma-coverage\lib\in-memory-report.js:14:22)
    at writeReport (E:\myapp\node_modules\karma-coverage\lib\reporter.js:68:16)
    at E:\myapp\node_modules\karma-coverage\lib\reporter.js:290:11
    at Array.forEach (native)
    at Collection.forEach (E:\myapp\node_modules\karma\lib\browser_collection.js:93:21)
    at E:\myapp\node_modules\karma-coverage\lib\reporter.js:247:16
    at Array.forEach (native)

=============================== Coverage summary ===============================
Statements   : 49.04% ( 16003/32631 )
Branches     : 24.32% ( 3140/12910 )
Functions    : 42.46% ( 3258/7673 )
Lines        : 49.86% ( 15287/30662 )
================================================================================
11 11 2016 15:46:02.173:ERROR [karma]: TypeError: Cannot read property 'text' of undefined
    at E:\myapp\node_modules\istanbul\lib\report\html.js:288:53
    at Array.forEach (native)
    at annotateBranches (E:\myapp\node_modules\istanbul\lib\report\html.js:255:30)
    at HtmlReport.writeDetailPage (E:\myapp\node_modules\istanbul\lib\report\html.js:426:9)
    at E:\myapp\node_modules\istanbul\lib\report\html.js:489:26
    at SyncFileWriter.writeFile (E:\FrontEnd\FrontEnd\node_modules\istanbul\lib\util\file-writer.js:57:9)
    at FileWriter.writeFile (E:\myapp\node_modules\istanbul\lib\util\file-writer.js:147:23)
    at E:\myapp\node_modules\istanbul\lib\report\html.js:488:24
    at Array.forEach (native)
    at HtmlReport.writeFiles (E:\myapp\node_modules\istanbul\lib\report\html.js:482:23)
    at E:\myapp\node_modules\istanbul\lib\report\html.js:484:22
    at Array.forEach (native)
    at HtmlReport.writeFiles (E:\myapp\node_modules\istanbul\lib\report\html.js:482:23)
    at HtmlReport.writeReport (E:\myapp\node_modules\istanbul\lib\report\html.js:566:14)
    at E:\FrontEnd\FrontEnd\node_modules\remap-istanbul\lib\writeReport.js:77:22
    at E:\myapp\node_modules\remap-istanbul\node_modules\amdefine\amdefine.js:125:34
PS E:\myapp>

我的配置文件如下：

karma.conf.js

module.exports = function(config) {
  var testWebpackConfig = require('./webpack.test');

  var configuration = {

    // base path that will be used to resolve all patterns (e.g. files, exclude)
    basePath: '',

    /*
     * Frameworks to use
     *
     * available frameworks: https://npmjs.org/browse/keyword/karma-adapter
     */
    frameworks: ['jasmine'],

    // list of files to exclude
    exclude: [ ],

    /*
     * list of files / patterns to load in the browser
     *
     * we are building the test environment in ./spec-bundle.js
     */
    files: [ 

      {pattern: './karma-test-shim.js', watched: false}
    ],

    /*
     * preprocess matching files before serving them to the browser
     * available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
     */
    preprocessors: { 
      './karma-test-shim.js': ['webpack', 'sourcemap','coverage']
    },

    // Webpack Config at ./webpack.test.js
    webpack: testWebpackConfig,

    coverageReporter: {
      type: 'in-memory'
    },

    remapCoverageReporter: {
      'text-summary': null,
      json: './coverage/coverage.json',
      html: './coverage/html'
    },

    // Webpack please don't spam the console when running in karma!
    webpackMiddleware: { stats: 'errors-only'},

    /*
     * test results reporter to use
     *
     * possible values: 'dots', 'progress'
     * available reporters: https://npmjs.org/browse/keyword/karma-reporter
     */
    reporters: [ 'mocha', 'coverage', 'remap-coverage'],

    // web server port
    port: 9876,

    // enable / disable colors in the output (reporters and logs)
    colors: true,

    /*
     * level of logging
     * possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
     */
    logLevel: config.LOG_INFO,

    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: false,

    /*
     * start these browsers
     * available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
     */
    browsers: [
      'Chrome'
    ],

    customLaunchers: {
      ChromeTravisCi: {
        base: 'Chrome',
        flags: ['--no-sandbox']
      }
    },

    /*
     * Continuous Integration mode
     * if true, Karma captures browsers, runs the tests and exits
     */
    singleRun: true
  };

  if (process.env.TRAVIS){
    configuration.browsers = [
      'ChromeTravisCi'
    ];
  }

  config.set(configuration);
};

webpack.test.js

var helpers = require('./helpers');

module.exports = {

  devtool: 'inline-source-map',

  resolve: {
    extensions: ['', '.ts', '.js']
  },

  module: {
    loaders: [
      {
        test: /\.ts$/,
        loaders: [
           'awesome-typescript-loader?sourceMap=false,inlineSourceMap=true',
           'angular2-template-loader'
        ]
      },
      {
        test: /\.html$/,
        loader: 'html'

      },
      {
        test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
        loader: 'null'
      },
      {
        test: /\.css$/,
        exclude: helpers.root('_COMMON', 'REF01'),
        loader: 'null'
      },
      {
        test: /\.css$/,
        include: helpers.root('_COMMON', 'REF01'),
        loader: 'raw'
      }
    ],
    postLoaders: [{
      test: /\.ts$/,
      exclude: /(node_modules|OPF\\REF01\\spa_test)/,
      loader: 'istanbul-instrumenter'
    }]
  }

}

package.json

{
  "name": "angular2-webpack",
  "version": "1.0.0",
  "description": "A webpack starter for angular 2",
  "scripts": {
    "start": "webpack-dev-server --inline --config ./OPF/REF01/build/webpack/webpack.config.js --progress --port 8080",
    "test": "karma start",
    "build": "rimraf ./OPF/REF01/release && webpack --config ./OPF/REF01/build/webpack/webpack.prod.js --progress --profile --bail",
    "postinstall": "typings install"
  },
  "license": "MIT",
  "dependencies": {
    "@angular/common": "2.1.2",
    "@angular/compiler": "2.1.2",
    "@angular/core": "2.1.2",
    "@angular/forms": "2.1.2",
    "@angular/http": "2.1.2",
    "@angular/platform-browser": "2.1.2",
    "@angular/platform-browser-dynamic": "2.1.2",
    "@angular/router": "3.1.2",
    "@angular/upgrade": "2.1.2",
    "core-js": "2.4.1",
    "reflect-metadata": "0.1.8",
    "rxjs": "5.0.0-beta.12",
    "zone.js": "0.6.26",
    "angular2-in-memory-web-api": "0.0.21",
    "bootstrap": "3.3.7"
  },
  "devDependencies": {
    "ag-grid": "6.2.1",
    "ag-grid-ng2": "6.2.0",
    "angular2-template-loader": "0.4.0",
    "css-loader": "0.23.1",
    "extract-text-webpack-plugin": "1.0.1",
    "file-loader": "0.8.5",
    "html-loader": "0.4.3",
    "html-webpack-plugin": "2.15.0",
    "istanbul-instrumenter-loader": "^0.2.0",
    "jasmine-core": "^2.5.2",
    "karma": "^1.3.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-coverage": "^1.1.1",
    "karma-jasmine": "^1.0.2",
    "karma-mocha-reporter": "^2.2.0",
    "karma-phantomjs-launcher": "^1.0.2",
    "karma-remap-coverage": "^0.1.2",
    "karma-remap-istanbul": "^0.2.1",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-webpack": "^1.8.0",
    "null-loader": "0.1.1",
    "phantomjs-prebuilt": "^2.1.7",
    "raw-loader": "0.5.1",
    "rimraf": "2.5.2",
    "style-loader": "0.13.1",
    "ts-helpers": "^1.1.2",
    "ts-loader": "0.8.1",
    "typescript": "2.0.3",
    "typings": "1.0.4",
    "webpack": "1.13.0",
    "webpack-dev-server": "1.14.1",
    "webpack-merge": "0.14.0"
  }
}

任何形式的帮助都会非常感谢。

Answer 1

两件事

1. 您没有针对ts文件的任何加载程序，您只是从ts文件中获得模板加载器。{ test: /..ts$/，加载程序：‘太棒了-类型-加载程序?sourceMap=false，inlineSourceMap=true'，’angular2 2-模板-加载程序‘}
2. 你不是伊斯坦布尔-工具匠后装载机。postLoaders：{ test: /..ts$/，排除: /(node_modules|app\spec)/，加载程序：‘伊斯坦布尔-工具中心’} 您的排除表达式可能不一样。

如果这有帮助的话，我会尝试把我的工作样本放在github上。

Answer 2

设置“业力-重新映射-伊斯坦布尔”严格版本为"0.5.0“帮助我。

"karma-remap-istanbul": "0.5.0",

Answer 3

我刚刚把记者remap-coverage从karma.conf.js上删除了，如下所示：

reporters: ['mocha', 'coverage', 'tfs', 'sonarqubeUnit']