如何配置Visual Studio Code调试器以使用Chrome Canary？

Question

我正在同时处理多个项目,对于其中一个项目,我想使用Chrome Canary在Visual Studio Code中调试我的应用程序.

所以对于稳定的Chrome我有

{
        "name": "Launch Chrome",
        "type": "chrome",
        "request": "launch",
        "url": "http://localhost:7246/",
        "runtimeArgs": [
            "--new-window",
            "--remote-debugging-port=9222"
        ],
        "webRoot": "${workspaceRoot}/app/"
}

有没有简单的方法在launch.json中配置在单独的调试端口(例如9223)上使用Chrome Canary,所以我可以使用Chrome Stable和调试端口9222进行所有其他操作？

Answer 1

您只需添加：

 "runtimeExecutable": "canary",

Answer 2

您应该能够使用该runtimeExecutable属性来指定要测试的 Chrome 版本的路径，并结合runtimeArgs为该配置指定不同的调试端口。该configurations物业launch.json允许你指定配置的阵列。

我自己没有看过 VS Code，所以无法验证这一点，但这里有一些有用的信息：https : //github.com/Microsoft/vscode-chrome-debug

更新 您可以使用环境变量路径而不是绝对路径。

在命令提示符中，尝试像这样创建环境变量：

set CHROME_PATH=C:/Users/[USER]/AppData/Local/Google/Chrome SxS/Application

在配置文件中，可以像这样引用路径：

${env.CHROME_PATH}/chrome.exe

查看https://code.visualstudio.com/Docs/editor/tasks#_variable-substitution了解更多详情。

Answer 3

对我来说,Chrome Canary的工作版本是

{
        "name": "Chrome Canary",
        "type": "chrome",
        "request": "launch",
        "url": "http://localhost:7246/",
        "port": 9223,
        "runtimeExecutable": "${env.USERPROFILE}/AppData/Local/Google/Chrome SxS/Application/chrome.exe",
        "runtimeArgs": [
            "--new-window",
            "--remote-debugging-port=9223"
        ],
        "webRoot": "${workspaceRoot}/app/"
}