title: How do you use Istanbul Code Coverage with transpiled Typescript?
body: <p>I've been reading articles on this all morning trying to get my environment setup correctly. But for some reason I'm not getting it. My setup-</p>
  
  <pre><code>/app
      ... source (mixed js and ts)
  /scripts
      ... copied source (js)
      typescripts.js // transpiled typescript with inline mapping
  </code></pre>
  
  <p>Tests run fine, and with the mapping debugging in the chrome debugger is mapped correctly. But Istanbul sees the <code>typescripts.js</code> file as one file instead of the concatenation of dozens of other files.</p>
  
  <p>To generate the typescript source I'm using <code>gulp-typescript</code>. The source (excluding tests) are transpiled to the aforementioned <code>typescripts.js</code>, and the tests are transpiled individually and copied to <code>/scripts</code>.</p>
  
  <pre><code>  var ts = require('gulp-typescript');
    var sourcemaps = require('gulp-sourcemaps');
    var concat = require('gulp-concat');
  
    module.exports = function (gulp, config) {
       'use strict';
  
       // Runs dot ts files found in `www` through the typescript compiler and copies them as js 
       // files to the scripts directory
  
       gulp.task('typescript', ['typescript:tests'], function () {
          return gulp.src(config.paths.typescript) // [ './www/app/**/*.ts', '!./www/app/**/*.test.ts', '!./www/app/**/*.mock.ts' ]
             .pipe(sourcemaps.init())
             .pipe(ts(ts.createProject(config.paths.tsConfig))) // './tsconfig.json'
             .js
             .pipe(concat(config.sourcemaps.dest)) // typescripts.js
             .pipe(sourcemaps.write(config.sourcemaps)) // { includeContent: false, sourceRoot: '/app' } - i've also tried absolute local path
             .pipe(gulp.dest(config.paths.tmpScripts)); // ./www/scripts
  
  
       });
  
       gulp.task('typescript:tests', [], function() {
          return gulp.src(config.paths.typescriptTests) // [ './www/app/**/*.test.ts', './www/app/**/*.mock.ts' ]
             .pipe(ts(ts.createProject(config.paths.tsConfig))) // './tsconfig.json'
             .pipe(gulp.dest(config.paths.tmpScripts)); // ./www/scripts
       });
    };
  </code></pre>
  
  <p>The resulting <code>typescripts.js</code> has the inline sourcemap. With the sourcemap, the dozen or so ts files results in 106kb.</p>
  
  <p><strong>So from here tests and debugging works fine.</strong></p>
  
  <p>Now in an attempt to get Istanbul code coverage working properly i've installed <code>karma-sourcemap-loader</code> and added it to the preprocessors.</p>
  
  <pre><code>preprocessors: {
      'www/scripts/typescripts.js': ['sourcemap'],
      'www/scripts/**/*.js': ['coverage']
  },
  </code></pre>
  
  <p>I'd think this is what I'd need to do. But it does not show code coverage on the source files. I tried the absolute path from <code>C:/</code> but that didn't work either. I also tried the different options in <code>gulp-sourcemaps</code> like adding source (which pushed the file to 160kb) but no like either.</p>
  
  <p>Has anyone gotten this to work? Any ideas what I could be doing wrong?</p>