If you run that configuration, your browser will launch with your web page. Open helloweb. ts in the editor and click the left gutter to add a breakpoint (it will be displayed as a red circle). Press F5 to start the debug session, which launches the browser and hits your breakpoint in helloweb.
To debug TypeScript, we need to create an index. html and inside that we need to link our findbug. js file, this is because we will use the Chrome DevTools and we will be able to debug our TypeScript file. After that, we need to install live-server or use the live-server extension for VS Code.
Here is my workflow.
I have moduled typescript code. Imports like the following: import { Logger } from './../data/logger';
Then I bundle it using webpack (precisely - webpack-stream) with ts-loader. I run webpack using gulp.
So I have the following workflow: gulp --> webpack (ts-loader) --> bundled *.js with source-maps. I also use the browsersync to run simple server and auto update the page.
I can debug this code from the browser, but I can't from vscode (using Chrome Debugging for VS Code, or even from vs2015.
What could cause the problem ?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With