Typescript -> Babel sourcemaps using webpack

Copy paste from ts-loader issues as it might be more appropriate here:

How to pass the typescript sourcemaps to babel so the end sourcemap point to the original file and not the compiled typescript one?

Here's an example of my dev settings:

tsconfig.json:

{
  "compilerOptions": {
    "target": "es6",
    "jsx": "react",
    "noImplicitAny": false,
    "sourceMap": true
  },
  "exclude": ["node_modules", "gulpfile.js", "webpack.config.js", "server.js"]
}

webpack.dev.js:

var path = require("path");
var webpack = require("webpack");

module.exports = {
  devtool: "eval",
  entry: [
    "webpack-hot-middleware/client",
    "./src/app/index",
  ],
  output: {
    path: path.join(__dirname, "build"),
    filename: "app.js",
    publicPath: "/static/"
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin(),
    new webpack.ProvidePlugin({
      'window.fetch': 'exports?self.fetch!whatwg-fetch'
    })
  ],
  resolve: {
    extensions: ['', '.ts', '.tsx', '.js']
  },
  module: {
    noParse: [
      /\/sinon.js/
    ],
    preLoaders: [{
      test: /\.ts(x?)$/,
      loader: "tslint",
      exclude: /node_modules/
    }],
    loaders: [
      {
        test: /\.tsx?$/,
        loader: 'babel-loader!ts-loader',
        exclude: /node_modules/,
        include: path.join(__dirname, 'src')
      }
    ]
  }
};