无法在Visual Studio Code中使用Debugger for Chrome放置断点

Question

我只是想调试我的html页面中的一些javascript。

我按如下方式设置配置：

但是当我调试我的html页面时（使用名为“启动div.html”的第二个选项），它会运行，但我无法设置断点...

有任何想法吗？

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [        
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:8080/",
            "webRoot": "${workspaceFolder}"
        },
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch the div.html",            
            "sourceMaps": true,
            "file": "${workspaceFolder}/div.html",
            "webRoot": "${workspaceFolder}"
        }

    ]
}

Answer 1

似乎不支持调试内联JavaScript（我也不能设置断点）。你必须将你的JS代码分成它自己的文件并将其包含在div.html中，如下所示：<script src="div.js"></script>现在在你的div.js中设置断点并开始调试。我第一次运行调试时遇到了问题，没有点击/加载断点。我可以解决这个问题，点击绿色的“重启”调试按钮。

PS：您需要安装Debugger for Chrome扩展程序，但似乎您已经这样做了。