My goal is to have an angular2 project setup where I can debug into the source code of dependencies (present in the node_modules directory). To be more precise I want to be able to debug (e.g. set breakpoints) in the actual typescript files (I don't mean my own typescript files but the files of the dependency) in chrome dev tools. This should be possible if the dependency contains source maps.
I tried to use angular-cli but apparently this is not yet possible, see debugging into angular 2 typescript source code.
So I tried to start with a basic angular-seed project and adjusting it. This project is using webpack and I added the following to the webpack.config.js:
...
module: {
preLoaders: [
{
test: /\.js$/,
loader: 'source-map-loader'
}
],
...
This actually works for some packages like rxjs but it does not work for the @angular packages because the bundled files (e.g. core.umd.js etc) do not contain source maps (the angular 2 team removed them due to this bug). But only the bundled files lack source maps, the non-bundled files in src folder contain source maps. How can I tell webpack to use the non-bundled files instead of the bundled files?
This article describes and solves the same problem but he is using SystemJS. How can we solve it with webpack?
