WebStorm 中调试 (Debug) JavaScript 文件(js)
在 WebStorm 中调试 JavaScript 文件,您可以设置断点,启动调试会话,并使用浏览器中的开发者工具来查看变量和执行流程。以下是详细步骤:
设置断点
打开您的 JavaScript 文件。
在您想要暂停执行的代码行点击并按下 F9 键,这样就会在那一行代码上创建一个断点。
启动调试会话
点击顶部菜单栏的 Run > Debug...
或者使用 Shift + F9
快捷键启动调试会话。
选择合适的运行/调试配置,如果是在浏览器中运行的代码,则可能需要配置一个 Web Server。
点击 OK
开始调试。
在调试中操作
当执行到达带有断点的代码行时,WebStorm 会暂停执行并允许您查看变量值、单步执行等。
使用调试工具栏上的按钮进行操作:
Resume Program (F9):继续执行程序直到下一个断点。Step Over (F8):逐行执行当前函数,不进入函数内部。Step Into (F7):进入当前行中调用的函数。Step Out (Shift + F8):从当前函数返回到调用它的函数。Restart (Ctrl + F5):重新启动调试会话。使用开发者工具查看变量和执行流程
在浏览器中打开调试页面,并打开开发者工具(通常是按 F12 键)。
在开发者工具中,切换到 Sources
或 Debugger
标签页,找到您的 JavaScript 文件。
在这里,您可以查看变量值、执行流程,以及在调试会话中的所有断点。
确保您的 WebStorm 已经安装并启用了 JavaScript 语言支持,并且您的项目设置中已经包括了您正在调试的 JavaScript 文件。
通过以上步骤,您可以在 WebStorm 中轻松调试 JavaScript 文件,并查看变量和执行流程,以便更好地理解代码的执行过程和调试问题。