Depuração no Web Inspector do Safari, ao usar um carregador de módulo como SystemJS

Estou criando um Ionicaplicativo usando es6 modules, TypeScripte SystemJScomo um carregador de módulo. Esta é minha configuração:

tsconfig.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>

script de exemplo (TypeScript):

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

export class ConfigLoader {
    ...
}

Tudo funciona muito bem no Chrome. No entanto, ao depurar usando o Web Inspector do Safari, não posso colocar nenhum ponto de interrupção nos scripts porque o Web Inspector só mostra scripts que são carregados diretamente do HTML (por meio de tags de script), e não scripts carregados por XHR (no meu caso, por SystemJS) . Isso significa que não posso depurar meus próprios scripts, o que é obviamente inaceitável.

Tentei contornar isso usando SystemJS como antes, mas também colocando as tags de script no html, assim:

<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>

No entanto, isso não funciona, porque SystemJS não parece feliz com isso:

Chamada System.register inválida. As chamadas System.register anônimas só podem ser feitas por módulos carregados por SystemJS.import e não por meio de tags de script.

Como uso o SystemJS e, ao mesmo tempo, posso depurar no Safari? Estou procurando uma solução um pouco mais sofisticada do que 'colocar uma instrução do depurador em cada script' ...

javascript safari ecmascript-6 systemjs web-inspector Fikkatra
fonte

Isso pode parecer um conselho estranho, e já que a questão está em aberto desde 11 de janeiro, mas eu o aconselharia a mergulhar no webpack. Tenho lido o SystemJS, mas não tenho a sensação de que ele atenderá às suas necessidades.

DevNebulae

Parece que se você não consegue carregar o script no html como estava fazendo, você está sem sorte. O Chrome parece ser o único navegador compatível com isso, como você viu.

The Muffin Man

Possível duplicata de Como depurar JavaScript carregado dinamicamente (com jQuery) no próprio depurador do navegador?

Mikayla Maki

usar debuggerpalavra

Kamil Kiełczewski

@ KamilKiełczewski A questão afirma explicitamente 'Estou procurando uma solução um pouco mais sofisticada do que' colocar uma instrução do depurador em cada script '...'

fikkatra

Depuração no Web Inspector do Safari, ao usar um carregador de módulo como SystemJS

Respostas: