无法使用babel-node启动VSCode调试器来调试Node应用程序

4
当我在控制台输入 npm run debug 后,我得到了以下输出:"Debugger listening on ws://127.0.0.1:3090/d17dfe56-4fa4-4686-a62e-d07cff78c834"。当我在 Chrome 中访问这个地址时,我只看到了 "WebSockets request was expected"。为了使调试器正常工作,我应该修改哪些配置?我正在使用最新版本的 nodejs。 package.json 脚本:
"scripts": {
    "prod": "webpack -p --env.production --progress",
    "start": "babel-node --presets es2015 server/server.js",
    "watch": "nodemon --exec npm run start",
    "debug": "babel-node --presets es2015 server/server.js --inspect --debug-brk=3090"
  }

launch.json:

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch via NPM",
            "type": "node",
            "request": "launch",
            "runtimeExecutable": "npm",
            "program": "${workspaceRoot}/server/server.js",
            "restart": true,
            "runtimeArgs": [
                "run-script", "debug"
            ],
            "port": 3090
        },
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:3090",
            "webRoot": "${workspaceRoot}"
        },
        {
            "type": "chrome",
            "request": "attach",
            "name": "Attach to Chrome",
            "port": 3090,
            "webRoot": "${workspaceRoot}"
        }
    ]
}

文件结构:

├───.vscode
├───js
├───server
│   ├───db
│   ├───middleware
│   ├───models
│   ├───server.js 

enter image description here

1个回答

6
这似乎是与nodejs库版本>= 7.0.0有关的问题。 第一个解决方法: 在chrome中使用开发工具打开此文件的一个小技巧是复制链接中ws后面的代码。
Debugger listening on ws://127.0.0.1:3090/d17dfe56-4fa4-4686-a62e-d07cff78c834

将其附加在开发工具链接行的末尾,与ws=一起显示如下:

chrome-devtools://devtools/bundled/inspector.html?experiments=true&v8only=true&ws=127.0.0.1:3090/d17dfe56-4fa4-4686-a62e-d07cff78c834

这将使您能够在Chrome开发工具中打开您的程序。此问题的链接和解决方案在这里提供。
第二种方法是:我尝试安装旧版本的Node(即6.11.2)和npm(3.10),并在Visual Studio Code中进行了尝试,它完美地运行而没有任何问题。然而,通过上面第一种方法所示的技巧,我仍然能够使用最新版本的Node和npm。
编辑:为更好的理解格式化我的答案。

谢谢。我安装了6.2版本的Node.js,现在从控制台获取到正确的URL。然而,在Chrome开发工具的“源”中并没有server.js文件。我的launch.json有什么问题吗? - Umbrella
考虑到您已经从工作空间位置运行项目,您能否尝试将 "program": "${workspaceRoot}/server/server.js", 更改为 "program": "${workspaceRoot}/server.js", 并查看是否正在运行。 - Dhruvsito
很遗憾,"${workspaceRoot}/server.js"和"${workspaceRoot}"都不起作用。 - Umbrella
好的。当您尝试在launch.json中将"program": "${workspaceRoot}/server/server.js"更改为"program": "${file}"时会发生什么?这里的"program": "${file}"是全局启动配置,会自动获取您正在运行的项目的文件名。您不必像之前在launch.json中那样明确指定它。请尝试按上述代码替换并告诉我们是否有效。 - Dhruvsito
尝试了所有的组合,我总是看到上面截图中的内容。 - Umbrella
尝试创建一个虚拟文件,并使用“node”而不是“babel-node”启动调试器,这样可以正常工作。当我使用“babel-node”打开该文件时,我看到与我所附上的屏幕截图中相同的垃圾,而不是我的实际代码。 - Umbrella

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接