Javascript 使用Web包开发服务器调试angular 2应用程序

据我所知，网页包是使用angular2的最佳方式。它的开发对我来说是一个很大的麻烦，因为我不知道如何正确地调试它。在出现错误时，我会遇到大量错误，行号错误，无法真正调试typescript应用程序。我已经四处寻找了几个小时，试图找到正确的方法来设置webpack和angular 2，以便能够高效地调试，但没有运气

EXCEPTION: Uncaught (in promise): Error: Error in ./Trading class Trading - inline template:70:6 caused by: Cannot read property 'subscribe' of undefinedTypeError: Cannot read property 'subscribe' of undefined
    at Wrapper_SymbolSearch.subscribe (/TradingModule/SymbolSearch/wrapper.ngfactory.js:38:66)
    at CompiledTemplate.proxyViewClass.View_Trading0.createInternal (/TradingModule/Trading/component.ngfactory.js:94:27)
    at CompiledTemplate.proxyViewClass.AppView.create (http://localhost:3000/vendor.bundle.js:91690:21)
    at CompiledTemplate.proxyViewClass.DebugAppView.create (http://localhost:3000/vendor.bundle.js:92142:44)
    at CompiledTemplate.proxyViewClass.View_Trading_Host0.createInternal (/TradingModule/Trading/host.ngfactory.js:16:19)
    at CompiledTemplate.proxyViewClass.AppView.createHostView (http://localhost:3000/vendor.bundle.js:91703:21)
    at CompiledTemplate.proxyViewClass.DebugAppView.createHostView (http://localhost:3000/vendor.bundle.js:92159:52)
...

是由

error\u handler.js:51

转储的讨厌的堆栈跟踪的一个示例。我已经为webpack添加了角度加载器，但我需要一种更好的方法将其打包到dev中，以便易于调试

  use: [
    '@angularclass/hmr-loader?pretty=' + !isProd + '&prod=' + isProd,
    'awesome-typescript-loader?{configFileName: "tsconfig.webpack.json"}',
    'angular2-template-loader',
    'angular-router-loader?loader=system&genDir=compiled/src/app&aot=' + AOT
  ],

---

类交易-内联模板：70:6原因：无法读取未定义的属性“subscribe”

-是否检查了该模板和函数调用？是的，当然第70行是

。这就是为什么我说这些错误是可怕的。即使SyrMeCAMP也不能正常工作，搜索你的模板<代码>订阅（）/<代码>调用。现在使用角2做了一点，而那些神秘的错误似乎是课程的标准。Sourcemap在逐步浏览应用程序时很有帮助，但在应用程序抛出错误时就没有那么多了。无论如何，如果您正确地使用typescript（使用类型），它可以在编译之前捕获很多这些内容。但是，是的，我偶尔能感觉到你的痛苦。如果有一种方法可以获得更好的错误源代码映射，我很想知道。我的模板中绝对有0

.subscribe（）

调用，我的朋友。这是我要找的第一件事。我注释掉了整个模板，错误仍然存在，所以它甚至不是模板，它来自一个输出绑定

（myComponentOutput）=“someVar”

，因为如果我删除它，它肯定会消失