Tuesday, October 10, 2023

Debugging in TypeScript

debugging in typescript:
------------------------
Debugging is the process of line by line execution to identify logical errors
 (or) understanding execution flow

Debugging typescript requires 2 things
 1.debugger keyword
        this will stop terminate normal execution and control will be taken into
        debug mode for line by line execution  

 2.map file
       this is a linker file between typescript code and Javascript code, this will execute
       typescript equivalent Javascript code in the background

map file can be generated using sourceMap option with typescript compiler
 syntax:
    tsc <tsfilename> --sourceMap

  

Browser Debug

stringExample.ts 

let link:string ="<a href= 'home.html'>Home </a>";
let year:number=2023
let msg:string =`Next Year  ${year + 1} Card Expires`;
let path:string="\"C:\\Examples\\Images\\Img1.png"

When we run this, it will generate .js file, and we need to use that in the html code.

StringExampleHtml.html

<html>
    <head>
        <title>TS - Basic Concepts</title>
        <script src="stringexample.js"></script>
        <script>
            document.write("path= " + path  + "<br>");  
            document.write("message = " + msg  +"<br>");
            document.write("link = " + link  +"<br>");
        </script>
    </head>
    <body>
        Hello World <br>
    </body>
</html>


Output with Debugger







No comments:

Post a Comment

Thank you for visiting my blog

Kubernetes

Prerequisites We assume anyone who wants to understand Kubernetes should have an understating of how the Docker works, how the Docker images...