I recently setup a typescript > webpack project and I was really disappointed with the dev-tools debugging experience.<p>Webpack renames imported bindings, so<p><pre><code> import {foo} from './bar';
</code></pre>
becomes something like this<p><pre><code> let __webpack_require_foo_bar = _webpack_modules[5 /* foo */].bar;
</code></pre>
So if you are paused in the debugger and want to use foo in a watch statement, or use it in a computation you'll have to reference the real source instead of the source maps.<p>I found questions on SO, and it seems like a known and accepted problem, but I know I won't be able to sell my team on Webpack because of this.