怎么用vs2017 调试js

用VS2017调试JS的步骤包括：安装必要的扩展、设置断点、启动调试、使用控制台、结合浏览器调试。下面详细描述如何使用Visual Studio 2017进行JavaScript调试。

一、安装必要的扩展

在使用Visual Studio 2017调试JavaScript之前，确保你已经安装了必要的扩展和工具。

1. 安装Node.js工具

首先，确保你已经安装了Node.js工具。如果没有安装，可以通过以下步骤进行：

打开Visual Studio 2017。
进入“工具”菜单，选择“获取工具和功能”。
在弹出的“Visual Studio安装程序”中，找到并安装“Node.js开发”工作负载。

2. 安装JavaScript调试扩展

Visual Studio 2017默认支持JavaScript调试，但为了获得更好的调试体验，可以安装一些辅助扩展。例如，可以安装“Debugger for Chrome”扩展，它能更好地结合Chrome浏览器进行调试。

二、设置断点

调试的核心是设置断点，通过断点可以在代码执行到特定行时暂停运行，从而检查变量的值和程序的状态。

1. 打开JavaScript文件

在解决方案资源管理器中，找到并打开需要调试的JavaScript文件。

2. 设置断点

在JavaScript文件中，找到你希望暂停执行的代码行。点击行号旁边的灰色区域，或者按下F9键，即可设置断点。设置断点后，该行的背景会变成红色，并显示一个红色圆点。

三、启动调试

设置断点后，可以启动调试。

1. 选择启动项目

确保你选择了正确的启动项目。右键点击解决方案资源管理器中的项目，选择“设为启动项目”。

2. 启动调试

按下F5键，或者点击工具栏中的绿色“启动调试”按钮。Visual Studio将启动调试，并在命中断点时暂停执行。

四、使用控制台

Visual Studio 2017提供了强大的控制台工具，可以在调试过程中实时查看变量值、执行表达式等。

1. 监视窗口

在调试模式下，可以打开“监视”窗口（快捷键：Ctrl + Alt + W, 1）。在监视窗口中，可以添加变量或表达式，实时查看它们的值。

2. 即时窗口

即时窗口（快捷键：Ctrl + Alt + I）允许你在调试过程中执行任意JavaScript表达式，并立即查看结果。这对于调试和测试非常有用。

五、结合浏览器调试

虽然Visual Studio 2017内置了JavaScript调试功能，但结合浏览器调试工具可以获得更好的调试体验。特别是对于前端代码，浏览器自带的开发者工具非常强大。

1. 使用Chrome开发者工具

如果你使用Chrome浏览器，可以按下F12键打开开发者工具。开发者工具提供了控制台、元素检查、网络请求查看等功能。

2. 使用调试扩展

结合“Debugger for Chrome”扩展，可以在Visual Studio和Chrome之间无缝调试。安装扩展后，可以在Visual Studio中配置Chrome调试器，从而在Chrome浏览器中调试JavaScript代码。

六、使用研发项目管理系统PingCode和通用项目协作软件Worktile

在团队开发中，调试只是其中的一部分。为了更高效地管理项目和协作，可以使用一些专业的项目管理工具。

1. 研发项目管理系统PingCode

PingCode是一款专为研发团队设计的项目管理系统，提供了需求管理、任务跟踪、缺陷管理等功能。通过PingCode，可以更好地管理项目进度和团队协作。

2. 通用项目协作软件Worktile

Worktile是一款通用的项目协作软件，适用于各种团队和项目类型。它提供了任务管理、文档协作、即时通讯等功能，能够帮助团队高效协作。

总结起来，使用Visual Studio 2017调试JavaScript时，首先要安装必要的扩展和工具，然后通过设置断点、启动调试、使用控制台等步骤进行调试。结合浏览器调试工具，可以获得更好的调试体验。同时，在团队开发中，使用PingCode和Worktile等项目管理工具，可以提高项目管理和团队协作的效率。