CODEWITHSUNDEEP
typescriptgulpwebpackvisual-studio-code
nrudnyk
nrudnyk

Reputation: 954

How to debug typescript code, which is bundled using webpack in vscode/vs2015

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 ?

Upvotes: 13

Views: 2102

Answers (1)

user5928517
user5928517

Reputation:

Debugging Typescript is a bit different than debugging c# code. You need to debug from SourceMap.

To learn more about SourceMap, check this link.

Source level debugging is available in TypeScript since version 0.8.1

And if you want to read more about using TypeScript in Visual Studio 2015, Telerik has a great post about it on its developer blog.

Upvotes: 1

Related Questions