代码之家 › 专栏 › 技术社区 › Stephane

如何将VSCode调试器附加到浏览器?

brave vscode-debugger visual-studio-code google-chrome

Stephane · 技术社区 · 6 年前

当我在 Chrome VSCode 调试器。

调试器配置为:

{
    "name": "Attach to Chrome",
    "type": "chrome",
    "request": "attach",
    "port": 9222,
    "url": "http://localhost:4200/*",
    "webRoot": "${workspaceFolder}",
},

VS码

Angular 一个在 http://localhost:4200/users

Chrome Version 70.0.3538.102 (Build officiel) (64 bits)
Brave Version 0.56.12 Chromium: 70.0.3538.77 (Build officiel) (64 bits)
VSCode Version 1.23.0

在 Lubuntu 16.04

是 Brave 浏览器尚未准备好调试?或者我应该取消一些港口限制?我已经为这个web应用程序付了定金。但是 VS码 仍然没有连接到它。

0 回复 | 直到 6 年前

Community CDub 4 年前

有点晚,但是。。。。得到 brave-dev this

然后添加到你的 launch.json 一 "runtimeExecutable": "/usr/bin/brave"

其余的设置可以是默认设置

villaa19 4 年前

适用于MacOS用户

我可以连接以在中创建配置 launch.json "userData": true 因为我出错了。我看了这页就知道了。 https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome

{
    "type": "chrome",
    "request": "launch",
    "name": "Brave",
    "runtimeExecutable": "/Applications/Brave Browser.app/Contents/MacOS/Brave Browser",
    "userDataDir": true,
    "url": "http://localhost:8080",
    "webRoot": "${workspaceFolder}"
}

Nadge25 5 年前

开发版本的勇敢是没有必要的。

如果尚未完成,请添加到启动.json将此文件归档(如果路径不同,请调整路径)

"runtimeExecutable": "C:\\Program Files (x86)\\BraveSoftware\\Brave-Browser\\Application\\brave.exe",

John 4 年前

如其他答案中所述,您需要在启动.json指向浏览器可执行文件的项目的文件。

您还需要使用以下选项启动浏览器: --remote-debugging-port=9222

你有两种方法:

使用选项启动Brave(Windows:右键单击Brave快捷方式,选择properties,并在“target”字段中追加 ,MacOS/linux:执行 <path to brave>/brave --remote-debugging-port=9222 )(提醒:别忘了重启勇敢)
跟随 Cornelius 建议,您可以简单地添加以下内容到您的 launch.json

"runtimeArgs": [ "--remote-debugging-port=9222" ]

request: "launch" 选项,而不是 request: "attach" 如果您想使用“lauch”选项,它将打开另一个窗口,而不是新的选项卡。因此,从长远来看,您可能希望使用第一种方法。

Jmaurier 5 年前

对于那些需要查看完整代码上下文的人,这里是我完整的启动.json文件。中的第二项 "configurations" 数组导致brave的dev浏览器打开进行调试( you can download the Brave dev browser here )

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:4200",
            "webRoot": "${workspaceFolder}"
        },
        {
            "type": "chrome",
            "request": "launch",
            "name": "Brave",
            "runtimeExecutable": "C:/Program Files (x86)/BraveSoftware/Brave-Browser-Dev/Application/brave.exe",
            "url": "http://localhost:4200",
            "webRoot": "${workspaceFolder}"
        }
    ]
}

Chart96 4 年前

在运行Ubuntu 20.04的环境下勇敢地安装APT包管理器

"runtimeExecutable": "/usr/bin/brave-browser"

以下是整个启动.json看。如果你想复制这个,只要确保 file

{
    // 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": "pwa-chrome",
            "request": "launch",
            "name": "Open index.html",
            "file": "/home/my-user/myDirectory/index.html",
            "runtimeExecutable": "/usr/bin/brave-browser"
        }
    ]
}