【发布时间】：2015-10-29 06:11:29
【问题描述】：
我正在将 Visual Studio Code 用于 javascript 项目。您可以设置断点并非常轻松地单步调试在 nodejs 中运行的代码。有没有办法允许客户端断点和调试，浏览器运行代码？
通过 console.log 进行调试很快就会过时。
【问题讨论】：
标签： node.js debugging browser visual-studio-code
【发布时间】：2015-10-29 06:11:29
【问题描述】：
对于在 Chrome 中进行调试，有 Visual Studio Code: Debugger for Chrome extension。您可以在市场上找到此扩展，search 用于调试器，如debugging manual 中所述。不幸的是（目前）不支持其他浏览器，
调试 node.js 开箱即用，请参阅上面的调试手册或 John Papa 的 blog post。
至少在我看来，调试客户端和服务器（正如 Phil 评论的那样）是不可能的，因为您需要有两种不同的启动配置，抱歉。
【讨论】：
-
很好的答案。问题是我有一个包含服务器代码和客户端代码的节点项目。使用扩展似乎可以很好地调试客户端代码，但它不允许我运行节点，以便后端在调试前端的同时运行。
-
还有，浏览器的调试工具有什么问题？我不是在谈论将数据输出到控制台，而是逐步执行代码。您可以将
debugger;语句用于您无法轻易找到的源文件或那些通过 AJAX 下载并立即执行的代码块/文件。您可以在 Visual Studio 中调试 IE 的处理，但不能在其他浏览器 AFAIK 中调试。
您应该使用所有现代浏览器都有的开发工具 (F12)。 我更喜欢 chrome，因为有了workspaces，您可以在浏览器中内联编辑您的代码。
【讨论】：
-
那么，答案是否定的？如何使用 phantomjs 和 Visual Studio 代码获得与他描述的 nodejs 相同的体验？
-
我描述了前端浏览器代码的调试过程。是的，前端的答案是否定的。因为（如果我理解正确的调试过程）VS Code 应该附加到 Chrome 浏览器进行调试，因为它是两个不同的过程。这不是简单的理论任务。 Chrome 的答案是使用工作区并在浏览器中编辑代码。至于 PhantomJS，它没有任何 UI，那么你如何与之交互？
通过在 chorme 浏览器中打开您的项目并使用 chrome DevTools。 你可以随心所欲地调试它。
步骤：
打开您的项目（带有 url）。
打开 DevTools (F12)
选择“元素”并选择元素
你可以在右侧面板看到“事件监听器”，选择你需要的
然后，你可以右击你的事件，选择“显示函数定义”
尽情享受吧！
如果你的意思是Debug Nodejs，据我所知有一个名为“debuger”的npm包？
【讨论】：
另一种技术是使用 Visual Studio Code: Debugger for Chrome 扩展。保存 node.js 的 launch.json 配置内容并将其删除。然后创建 Chrome 的 launch.json。将两者结合起来，您可以在 Code 中调试服务器或客户端（但不能同时调试两者）。
要调试客户端，服务器必须正在运行，因此在命令提示符下使用“node”命令启动服务器。在代码中启动 Chrome 调试器并调试客户端。
【讨论】：