30

当我在浏览器中打开我的 Web 应用程序时，Chrome我可以将VSCode调试器附加到它。

调试器配置为：

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

但是当我在 Brave 浏览器中打开 Web 应用程序时，我无法附加VSCode调试器。

Web 应用程序是一个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 应用程序设置了屏蔽。但VSCode仍不依附于它。

4

7 回答 7

23

对于 MacOS 用户

我能够连接以创建配置，launch.json以便 Brave 浏览器在 MacOS 上启动。我附加了该"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}"
}
于 2020-02-08T20:36:30.230 回答
14

有点晚了，但是....brave-dev关注这个

然后添加到您launch.json的"runtimeExecutable": "/usr/bin/brave"条目并更改适合您的路径。

其余设置可以默认

于 2019-06-13T06:28:35.380 回答
8

不需要 Brave 的 DEV 版本。

在您的 Brave 浏览器中，在“chrome://settings/privacy”下，启用“远程调试”选项。

重新启动浏览器。

如果尚未完成，请将其添加到您的 launch.json 文件中（如果路径不同，请调整路径）

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

于 2020-03-24T15:43:09.107 回答
6

如其他答案中所述，您需要在项目的 launch.json 文件中添加一个“runtimeExecutable”字段，该字段将指向 Brave Browser 的可执行文件。

... 但 ...

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

你有两种方法可以做到：

  1. 使用选项启动 Brave（Windows：右键单击 Brave 快捷方式，然后选择属性，然后在“目标”字段中追加--remote-debugging-port=9222，MacOS / linux：执行<path to brave>/brave --remote-debugging-port=9222）（提醒：不要忘记重新启动 Brave）
  2. 按照Cornelius的建议，您可以简单地将以下内容添加到您的launch.json:
"runtimeArgs": [ "--remote-debugging-port=9222" ]

第二个选项仅在您有选项时才适用request: "launch"，而不是那个选项request: "attach"，并且如果您想使用“lauch”选项，它将打开另一个 Brave 窗口，而不是新选项卡。因此，从长远来看，您可能希望使用第一种方法。

于 2020-06-01T20:23:31.050 回答
2

对于那些需要查看完整代码上下文的人，这是我完整的 launch.json 文件。数组中的第二项"configurations"导致勇敢的开发浏览器打开以进行调试（您可以在此处下载勇敢的开发浏览器）

{
    "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}"
        }
    ]
}
于 2019-12-20T19:18:53.340 回答
0

在运行 Ubuntu 20.04 上使用 APT 包管理器勇敢安装

将此行添加到为 chrome 生成的标准 launch.json 中：

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

这是整个 launch.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"
        }
    ]
}
于 2021-02-01T23:35:33.757 回答
0

要遵循的步骤：

  1. 打开与代码。
  2. 等待秒。因为打开 vs 代码需要时间
  3. 见左侧搜索图标。
  4. 单击它并键入设置。
  5. 向下点击打开设置。
  6. 浏览器。

检查这个

"liveServer.settings.AdvanceCustomBrowserCmdLine": "brave

或试试这个：

.vscode\settings.json:
  {
  "liveServer.settings.AdvanceCustomBrowserCmdLine": "brave"
 }
于 2021-06-08T16:43:42.493 回答