< Angular

Angular debug

Szerző: Sallai András

Copyright © Sallai András, 2023

Licenc: CC Attribution-Share Alike 4.0 International

Web: https://szit.hu

Chromium a hibakövetéshez

Telepítsük a Chromiumot:

choco install chromium

apt install chromium

{ // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "type": "chrome", "request": "launch", "name": "Launch Chromium localhost", "url": "http://localhost:4200", "webRoot": "${workspaceFolder}", "runtimeExecutable": "/usr/bin/chromium", "runtimeArgs": [ "--new-window", "--disable-background-networking" ] } ] }

A Debug fülön válasszuk ki a „Launch Chromium localhost” lehetőséget, majd nyomjuk meg a futtatás gombot.

A megnyílt új ablakban nyissuk fejlesztő eszközt, például F12. Töréspontokat ebben a böngészőablakban tehetünk. Ehhez válasszuk a „Sources” fület. A fastruktúrában a webpack:// csomópontból kiindulva keressük meg a futó .js fájlt.

Tegyünk egy töréspontot a vizsgálni kívánt sorba, majd frissítsük a weboldalt. Visszakapjuk a VSCode ablakát, ahol elvégezhetjük a vizsgálatot.

Linkek

Eredeti megoldás

https://jsantacl.medium.com/how-to-debug-an-angular-app-using-vs-code-and-chromium-7eb60b0b0cee (2023)

Egyéb:

https://www.npmjs.com/package/ngx-logger (2023)

https://www.codemag.com/article/1711021/Logging-in-Angular-Applications (2023)