Angular 2 Test Coverage Using Karma - Unable to locate Source Maps

I've set up test coverage using Karma in my application using Karma Remap Coverage by making changes in the karma.config.js file as follows:

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine', '@angular/cli'],
    plugins: [
      require('karma-jasmine'),
      require('karma-coverage'),
      require('karma-chrome-launcher'),
      require('karma-remap-istanbul'),
      require('@angular/cli/plugins/karma')
    ],
    files: [{
      pattern: './src/test.ts',
      watched: false
    }],
    preprocessors: {
      './src/test.ts': ['@angular/cli']
    },
    mime: {
      'text/x-typescript': ['ts', 'tsx']
    },
    remapIstanbulReporter: {
      reports: {
        html: 'coverage',
        lcovonly: './coverage/coverage.lcov'
      }
    },
    remapCoverageReporter: {
      'text-summary': null,
      html: './coverage/html',
      cobertura: './coverage/cobertura.xml'
    },
    angularCli: {
      config: './angular-cli.json',
      environment: 'dev',
      codeCoverage: true
    },
    coverageReporter: {
      addNodeGlobals: true,
      instrumenterOptions: {
        istanbul: { noCompact: true }
      },
      reporters: [
        { type: 'json' },
      ],
      html: './coverage',
      dir: './coverage/',
      subdir: (browser) => {
        return browser.toLowerCase().split(/[ /-]/)[0]; // returns 'chrome'
      },
    },
    reporters: config.angularCli && config.angularCli.codeCoverage ? ['progress', 'coverage', 'karma-remap-istanbul'] : ['progress'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false
  });
};

I've run the command: ng test--code-coverage to run the test suite and generate the coverage. After running the tests successfully, I get the error:

Error: Could not find source map for: "path/to/module/file.ts"

The map files in my application are not in the "path/to/module/", instead the maps generated by the ng build command are stored as a main.bundle.js.map in the "./dist/" directory.

That said, I am obtaining a coverage dashboard that depicts the correct file structure but I'm unable to view the concerned files (probably because they couldn't be transpiled from typescript to es5).

How can I configure karma-remap-istanbul to locate the maps as per the configuration described above so that I can obtain the coverage details as html of the entire application.