简体   繁体   English

Visual Studio Community 2017的客户端和服务器端JavaScript调试经验

[英]Client and server side JavaScript debugging experience for Visual Studio Community 2017

I vaguely recall debugging client side JavaScript code inside of Visual Studio many years ago (this was before browsers has Dev Tools, and you had just the Firebug extension for Firefox), but more recently when I try it, I cannot break into the script inside of Visual Studio and I have to use the debugger in Dev Tools inside the browsers. 我隐约想起了很多年前在Visual Studio中调试客户端JavaScript代码的情况(这是在浏览器具有Dev Tools之前,而您只有Firefox的Firebug扩展),但是最近,当我尝试使用它时,我无法破解其中的脚本Visual Studio,我必须在浏览器内部的开发工具中使用调试器。

When I set a breakpoint within Visual Studio and run my application, the application does not honor the breakpoint and just keeps running. 当我在Visual Studio中设置一个断点并运行我的应用程序时,该应用程序不遵守该断点,而是继续运行。 When I look at the breakpoint in the code editor, I see a message that reads: 当我在代码编辑器中查看断点时,看到一条消息,内容为:

The breakpoint will not currently be hit. 断点当前不会被命中。 No symbols have been loaded for this document. 没有为该文档加载任何符号。

在此处输入图片说明

I am using Firefox 62.0.3 on 64-bit Windows. 我在64位Windows上使用Firefox 62.0.3。

My question is: 我的问题是:

  1. Just like the "Chrome Debugger" extension for Visual Studio Code allows for the JavaScript debugging experience inside Code , for both client and server side JavaScript, is there something that I can use with Visual Studio Community 2017 to debug JavaScript, and also support source maps? 就像Visual Studio Code的“ Chrome Debugger”扩展允许在Code内部进行JavaScript调试一样,对于客户端和服务器端JavaScript,我可以将它们与Visual Studio Community 2017一起使用来调试JavaScript,并且还支持源映射?

  2. Also, this is not very important, but since I have not been able to debug JavaScript inside Visual Studio for quite some time now, I am beginning to doubt whether I actually debugged it in Visual Studio or was it just a dream, or a memory gone wrong. 另外,这不是很重要,但是由于我已经有一段时间无法在Visual Studio中调试JavaScript了,我开始怀疑我是在Visual Studio中实际调试它还是只是梦想还是回忆。出错了。 But I am pretty sure, 100% that I did. 但是我很确定,我100%做到了。 But still, I don't know. 但是我还是不知道。 I know that I did, but sometimes, I just want to make sure that it wasn't just me. 我知道我做到了,但是有时候,我只是想确保它不只是我。

Adding a few more updates to the previous answer - 为先前的答案添加更多更新-

  1. Microsoft Edge debugging is supported starting with version 15.7 of Visual Studio 2017. You will need to be on " Windows 10 April 2018 Update " or later. 从Visual Studio 2017 15.7版开始支持Microsoft Edge调试。您需要使用“ Windows 10 April 2018 Update ”或更高版本。
  2. Also by default Javascript debugging has been disabled by default on Visual Studio 2017. You can enable that as shown in the post above or automatically let Visual Studio show the below dialog box when you start debugging with a breakpoint set in JavaScript/TypeScript file. 同样,默认情况下,默认情况下,Visual Studio 2017上还默认禁用Javascript调试。您可以启用上面的文章中所示的功能,也可以在使用JavaScript / TypeScript文件中设置的断点开始调试时自动使Visual Studio显示以下对话框。 Enabling JavaScript dialog box in Visual Studio 2017 在Visual Studio 2017中启用JavaScript对话框

Yes options are there to enable debugging JavaScript in visual studio 2017 too. 是的,也可以在Visual Studio 2017中启用调试JavaScript的选项。 1. Go to tools and then select options 2. Then by click on the debugging tag you can able to see many check box options. 1.转到工具,然后选择选项。2.然后,通过单击调试标签,您可以看到许多复选框选项。 3. In that check whether your visual studio is enable with JavaScript debugging options provided. 3.在该检查中,是否通过提供的JavaScript调试选项启用了Visual Studio。

By enabling this you can able to use Client Side JavaScript debugging on Visual Studio 2017 通过启用此功能,您可以在Visual Studio 2017上使用客户端JavaScript调试

The short answer is: 简短的答案是:

  1. The JavaScript debugging experience for Visual Studio is available only for debugging scripts inside Chrome and Internet Explorer. Visual Studio的JavaScript调试经验仅适用于Chrome和Internet Explorer中的调试脚本。 I am not sure if it is available with Microsoft Edge. 我不确定Microsoft Edge是否可用。 And since Internet Explorer is pretty much out of use, the only popular browser that this experience is surely available for is Chrome. 而且,由于Internet Explorer几乎已经用完,因此肯定可以使用这种浏览器的唯一流行浏览器是Chrome。

    So, make sure you select Chrome from the list of browsers in the toolbar when launching your debug session in Visual Studio. 因此,在Visual Studio中启动调试会话时,请确保从工具栏的浏览器列表中选择Chrome

在此处输入图片说明

  1. Yes, I wasn't dreaming. 是的,我不是在做梦。 I used to be able to debug those JavaScript files inside of Visual Studio, but at the time, I would be unconsciously using Internet Explorer. 我曾经能够在Visual Studio中调试这些JavaScript文件,但是那时,我会不自觉地使用Internet Explorer。 That experience was available only for Internet Explorer. 这种体验仅适用于Internet Explorer。

A few things to make sure you're doing before you start debugging: 在开始调试之前,请确保要执行以下操作:

  1. Make sure you're running a debug configuration, so all your symbols are loaded.To do that, go to Project -> Properties , and from the dialog, navigate to the Configuration Properties page, and select Debug as the active configuration for the fields highlighted in the picture below. 确保正在运行调试配置,因此所有符号都已加载。为此,请转到Project-> Properties ,然后从对话框中导航到Configuration Properties页面,然后选择Debug作为该字段的活动配置。在下面的图片中突出显示。

在此处输入图片说明

  1. Like Prasanna Brabourame said in his answer, check the checkbox that reads "Enable JavaScript debugging for ASP.NET (Chrome and IE)" from the Tools -> Options -> Debuggging dialog. 就像Prasanna Brabourame在回答中所说的那样,选中“ 工具->选项->调试对话框”中的“启用ASP.NET的JavaScript调试(Chrome和IE)” 复选框

在此处输入图片说明

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM