Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to debug Typescript in Visual Studio 2015 asp.net 5?

Is there a way to debug typescript files from visual studio 2015 CTP6 asp.net 5 application? If not then maybe there is a way to configure source map files, so when I debug them in browser and can automatically save changes to my .ts files on server? This might be hard, because .ts files are compiled by gulp, but maybe somebody found good solution for that?

like image 866
Marcin Avatar asked Mar 03 '15 14:03

Marcin


People also ask

Can we debug TypeScript file?

TypeScript is great for writing client-side code as well as Node. js applications and you can debug client-side source code with the built-in Edge and Chrome debugger.

How do you debug a script in asp net?

In Visual Studio, choose Tools > Options, expand the Environment node, select the Web Browser option, and click the Internet Explorer Options button. In the Internet Options dialog, enable script debugging by unchecking the "Disable script debugging (Internet Explorer)" option under the Browsing node (see Figure 1).


1 Answers

Debugging TypeScript with Visual Studio works with the right settings.

  1. First you make sure that you create source maps when compiling TypeScript to JavaScript. So you should have an xxx.js.map file near every xxx.js.

    Getting source maps by running the TypeScript compiler outside of Visual Studio does not cause any difficulty, at the tsc command line add:

    --sourcemap %1.ts 

    your gulp script will usually create sourcemaps by default.

  2. Configure your web application in Visual Studio.

    Set Internet Explorer as the start browser. I got it working only with IE and don't think any other browser will work. (edit: Somewhere I read that there is a Webkit debugging bridge, so Chrome debugging should be possible, but I do not remember the source.)

    In the project properties go to the "Web" tab and configure the "Debuggers" section at the bottom: Disable all debuggers! This is counter intutitive and you might see this error message:

    You have attempted to start the debugger, but based on your current debug settings on the Web properties page there is no process to debug.

    This occurs when the "Don't open a page. Wait for a request from another process" option is selected, and ASP.NET debugging is disabled. Please check your settings on the Web properties page and try again. As the error message says, the Start Action at the top of the Web properties should be another option, like "Current page".

    Set breakpoints in your .ts code inside Visual Studio now or later.

    Hit F5

While you can use the Visual Studio Editor to debug and edit .ts files, "Edit and Continue" will not work, there is currently no browser that can reload .js and .js.map files and continue. (Correct me anyone if I am wrong and I will be happy.)

like image 172
citykid Avatar answered Oct 02 '22 23:10

citykid