即使将应用剥离为2个文件,VsCode Chrome调试扩展程序也无法使用

Joh*_*icz 5 visual-studio-code

我使用的是Windows10。我没有运气来使用Angular2应用程序与VsCode Chrome调试扩展一起使用。我将应用程序剥离为只有2个文件的非Angular应用程序,但仍然没有任何进展。

我的断点没有命中,但仍然得到错误:无法连接到运行时进程,在10000毫秒后超时-(原因:无法连接到目标:连接ECONNREFUSED 127.0.0.1:9222)

这些是我当前的两个源文件:

index.html

<!DOCTYPE html>
<html>
<body>
<h1>External JavaScript</h1>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="myFunction()">Try it now</button>
<p><strong>Note:</strong> myFunction is stored in an external file called "myScript.js".</p>
<script src="myScript.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

MyScript.js

function myFunction() { document.getElementById("demo").innerHTML = "Paragraph changed."; }
Run Code Online (Sandbox Code Playgroud)

我的launch.json文件包含:

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch Chrome against localhost, with sourcemaps",
            "type": "chrome",
            "request": "launch",
            "url": "http://localhost:3000",
            "sourceMaps": true,
            "webRoot": "${workspaceRoot}"
        },
        {
            "name": "Attach to Chrome, with sourcemaps",
            "type": "chrome",
            "request": "attach",
            "port": 9222,
            "sourceMaps": true,
            "webRoot": "${workspaceRoot}"
        }
    ]
}
Run Code Online (Sandbox Code Playgroud)

我在命令窗口中启动lite-server。我一启动,就会在IE中打开一个标签,而该标签恰好已经在运行。地址栏中的“ http:// localhost:3000 / ”应用程序运行正常。(建立与IE的连接到底是什么?这可能与Chrome扩展程序发生冲突吗?)

我关闭了IE标签,然后转到VsCode中的调试。我将配置设置为“针对localhost启动Chrome ...”。我按F5键开始调试。它会打开一个Chrome窗口,并浏览到“ localhost:3000”。

该应用程序运行正常,但我的断点没有被击中,我在VSCode中遇到错误:“错误:无法连接到运行时进程,在10000毫秒后超时-(原因:无法连接至目标:连接ECONNREFUSED 127.0.0.1:9222 )”

似乎正在尝试使用第三种配置“附加到Chrome ...”。但是下拉菜单设置为第二个“ Launch Chrome ...”。我还要确保在按F5键之前杀死所有正在运行的Chrome副本。

我还应该提到,我可以在VsCode中创建一个node.js应用程序,并且由于内置支持,因此断点可以正常工作。

小智 2

右键单击 Chrome 快捷方式,然后选择属性 在“目标”字段中追加--remote-debugging-port=9222或在命令提示符中执行/chrome.exe --remote-debugging-port=9222