全新调试神器 vscode-js-debug，让你告别调试难题！

前言
想必各位年轻人,都看过idea，visual studio 上刁炸天的调试机制，像这样:

当然你可以实时的计算某一个值，或者监视某一个值:

又或者像visual studio不仅像idea 那样有侧边栏让你查看，它还可以直接debug node.js，也可以像现在有“源代码地图”技术那样，直接debug你运行的JavaScript源码：

前端有没有这么吊的debug工具呢？那当然有了，而且不比原生的idea,vs的差，如果你不知道的话，那就请你继续往下看!

vscode-js-debug介绍

vscode-js-debug 是一个非常强大的 JavaScript 调试工具，它可以让你轻松调试 JavaScript 代码，并且提供了许多强大的功能，比如：

• 断点调试：你可以设置断点，然后在断点处暂停代码执行，以便你可以检查变量的值和调用堆栈。
• 单步调试：你可以一步一步地执行代码，以便你可以看到代码是如何运行的。
• 表达式求值：你可以计算表达式的值，以便你可以检查变量的值。
• 监视变量：你可以监视变量的值，以便你可以看到变量的值是如何变化的。
• 调试控制台：你可以使用调试控制台来执行命令和检查变量的值。

vscode-js-debug安装

vscode-js-debug 是一个非常容易安装的工具，你只需要按照以下步骤操作即可：

1. 打开 VS Code，然后单击“扩展”图标。
2. 在搜索框中输入“vscode-js-debug”，然后单击“安装”按钮。
3. 安装完成后，重新加载 VS Code。

vscode-js-debug使用

vscode-js-debug 安装完成后，你就可以开始使用了。以下是如何使用 vscode-js-debug 调试 JavaScript 代码的步骤：

1. 打开你要调试的 JavaScript 文件。
2. 在你想要设置断点的地方单击鼠标左键。
3. 单击“调试”菜单，然后单击“开始调试”。
4. 代码将开始执行，并且将在你设置的断点处暂停。
5. 你可以使用调试控制台来执行命令和检查变量的值。
6. 你可以使用单步调试来一步一步地执行代码。
7. 你可以使用表达式求值来计算表达式的值。
8. 你可以使用监视变量来监视变量的值。

结语

vscode-js-debug 是一个非常强大的 JavaScript 调试工具，它可以让你轻松调试 JavaScript 代码，并且提供了许多强大的功能。如果你是一名 JavaScript 开发者，那么 vscode-js-debug 是你必备的工具。