在使用 SystemJS 这样的模块加载程序时，在 Safari 的 Web 检查器中进行调试

我正在创建一个 Ionic应用程序使用 es6 modules，TypeScript和 SystemJS作为一个模块加载程序。这是我的设置:

Json:

{
"compilerOptions": {
...
"target": "es5",
"module": "system",
...
}
}

index.html:

<script src="lib/system.js"></script>
<script src="systemjs.config.js"></script>
<script>System.import('js/app.js')</script>

示例脚本(TypeScript) :

import {IConfig} from "./app-config";


export class ConfigLoader {
...
}

在 Chrome 中一切都运行良好。然而，在使用 Safari 的 Web 检查器进行调试时，我不能在脚本中放置任何断点，因为 Web 检查器只显示直接从 HTML (通过 script 标记)加载的脚本，而不显示由 XHR (在我的例子中，由 SystemJS)加载的脚本。这意味着我不能调试自己的脚本，这当然是不可接受的。

我试图像以前一样使用 SystemJS 来解决这个问题，但是也将 script 标记放在 html 中，如下所示:

<script src="lib/system.js"></script>
<script src="systemjs.config.js"></script>
<script src="js/app-config.js"></script>
... other app scripts
<script>System.import('js/app.js')</script>

然而，这并不奏效，因为 SystemJS 似乎对此并不满意:

无效的 System.register 调用由 SystemJS.import 加载的模块生成，而不是通过脚本标记生成。

How do I use SystemJS and at the same time have the ability to debug in Safari? I'm looking for a solution a little more sophisticated than 'put a debugger statement in each script'...

2954