嗨，我在 VS Code 中直接运行 Chrome 调试器时遇到了问题。我正在研究 Linux Mint。

现在我尝试运行调试器，错误消息说：无法启动浏览器：“无法找到稳定的 Chrome 版本。可用的自动发现版本是：[“dev”]。您可以将 launch.json 中的“runtimeExecutable”设置为其中之一，或提供浏览器可执行文件的绝对路径。”

在 sugesstion 之后，我将 runtimeExecutable 添加到 chromeExecutable ，现在错误是：

无法附加到浏览器。

我的机器上安装了谷歌浏览器版本：83.0.4103.116-1。

提前感谢您的帮助

错误：

当前配置：

我正在努力让 VS Code 调试器附加到 Chrome，作为我常规工作流程的一部分。

我让 Chrome 一直运行，备受推崇的 VS Code Live Server 扩展在我喜欢的新选项卡中打开我的项目。我希望能够将 VS Code 调试器附加到这个实例，但看起来我必须从命令行启动 Chrome

sudo /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222

几个问题：

1. 有没有办法修改 Chrome 的配置文件，使其始终以该标志集开头？
2. 这是一件愚蠢的事情吗？
3. 我真的需要sudo上面那一行吗？有些来源没有它。
4. 或者，有没有办法为 chrome 创建桌面/工具栏快捷方式，以启动它并启用远程调试？

谢谢！

PS 我看到了Windows的相关SO 问题。

我最近从 VS 2017 升级到了 VS 2019。

在 VS 2017 中，当在本地运行 asp.net 应用程序时，使用 Chrome，我可以在 javascript 代码中放置一个断点，调试器将在断点处停止。这不再适用于 Visual Studio 2019。

我需要做什么才能使用 Chrome 在 Visual Studio 2019 中启用 javascript 调试？我希望能够在 javascript 文件中放置断点并让它们命中。

这是我的设置。

1. 我启用了 Javascript 调试。

2. 我在我的 JavaScript 代码中放置了一个断点。此断点位于 *.js 文件中（不在 Razor 视图中）。

3. 断点被忽略。Visual Studio 非常礼貌地向我展示了一个工具提示，告诉我断点将被忽略。

我在 Windows 10 机器上，使用 WSL 2 (Ubuntu 18.04) 的 VS Code 尝试使用Chrome 调试器扩展，但无济于事。以下是我的launch.json：

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch index.html",
            "type": "chrome",
            "request": "launch",
            "file": "${workspaceFolder}/index.html",
            "runtimeExecutable": "/mnt/c/Program Files (x86)/Google/Chrome/Application/chrome.exe",
            "runtimeArgs": [" --remote-debugging-port=9222"],
            "userDataDir": "${workspaceFolder}/chrome",
            "port": 9222
        },
    ]
}

index.html每当我按 F5 时，我都希望看到我的页面加载到新的 Chrome 选项卡中，但它所做的只是启动一个新的空白 Chrome 窗口，然后间隔大约 15 秒弹出两个错误。

我不太关心第一个错误，它说Google Chrome cannot read and write to its data directory: <VALID-DIRECTORY-ON-MY-MACHINE>. 过去一天半我一直试图解决的是第二个错误，它说

Cannot connect to runtime process, timeout after 10000 ms - …

我正在使用Visual Studio Code中的Chrome Debugger插件来调试Angular应用程序.在升级到使用angular/cli@1.7.0之后,我们在调试时不再能够在VS Code中的typescript代码中找到断点.如果我们回滚到angular/cli@1.6.7,断点会再次开始工作.

这是我的ng -v输出:

Angular CLI: 1.7.0
Node: 9.2.0
OS: win32 x64
Angular: 5.2.5
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.7.0
@angular-devkit/build-optimizer: 0.3.1
@angular-devkit/core: 0.3.1
@angular-devkit/schematics: 0.3.1
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 1.10.0
@schematics/angular: 0.3.1
@schematics/package-update: 0.3.1
typescript: 2.5.3
webpack: 3.11.0

还有其他人遇到过这种情况吗？

我有一个带有开放式Dev/F12工具的网页(在Chrome中).

调整页面大小时,一些JavaScript代码肯定会修改一个观察到的div的样式属性(chrome显示紫色的修改属性):

有没有办法知道JS代码到底是做什么的,跟踪修改DOM元素的JS源码？

概括

我有一个独特的情况，我们创建了一个（由于缺乏更好的术语）“micro-ui”作为 React 组件。UI 接收 props，因此它可以动态配置自身以在我们的几个较大的应用程序中工作。由于它在多个应用程序中使用的性质，我们决定将其作为导出单个组件的组件库进行分发。它的实现效果非常好，但是调试变得有点困难/不存在。

目前，我们正在npm link本地开发依赖应用程序，同时在主机应用程序中运行它。这很有效，但我们在源映射和捕获断点方面遇到了一些问题。我们已经使用一些 Webpack 配置解决了源映射问题，但断点仍然无法在链接的依赖项应用程序中捕获。当前，调试器附加到正在运行的主机应用程序，并且依赖项应用程序只是作为本地依赖项链接。在理想的情况下，我将能够找到一种解决方案，允许我在主机应用程序或依赖项应用程序中放置断点，并且它会在调试器中捕获。

迄今为止的尝试

我目前的尝试是直接在 vscode 中调试，我想我已经差不多了。到目前为止，我已经尝试了 launch.json 文件的多个版本，并最终选定了一个在附加主机应用程序时效果非常好的版本（如下所示）。

正如您所看到的，我尝试将映射添加到 sourceMapOverrides 键，以查看是否可以将node_modules依赖项的文件夹显式指向依赖项项目根目录中的构建文件夹。我已经尝试了几种不同的方法来进行此映射，但它没有捕获链接应用程序中的断点。此外，没有抛出明显的错误，因此我无法判断我的配置是否无效。我确信我错过了一些明显的东西，但经过一整天的搜索，我似乎找不到一个好的解决方案。

预先感谢大家的时间和帮助，如果您需要更多信息，请告诉我。

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:3000",
            "webRoot": "${workspaceFolder}",
            "runtimeArgs": ["--preserve-symlinks"],
            "sourceMapPathOverrides": {
                "${webRoot}/node_modules/<dependency_project>/build": "/Users/<USER>/<path_to_dependency_project>/build",
            }
        }
    ]
}

我正在使用 Chrome 开发工具调试 NodeJS 应用程序。当应用程序处于调试模式时，我可以使用单击创建断点。但是我必须右键单击并删除断点。我无法再次通过单击删除断点。或者我必须将其从右侧的断点列表中删除。node --inspect-brk server.js如果重要的话，使用命令启动应用程序。

Google Chrome 版本 -> 83.0.4103.116（官方版本）（64 位）
节点版本 -> v9.11.2
npm 版本 -> 6.14.5
macOS Catalina -> 10.15.4

当我的 JS 代码在旧 ipad 上运行时，我正在尝试调试内存不足问题

有没有办法在 Chrome 开发工具中设置模拟内存限制，以便在违反时出现内存不足异常等？

用例

我想调试 Angular 11 Web 应用程序的 html 代码中的变量。

我设法获取ctx.ngForOf变量，但这是我所能做的。

我的程序中缺少某些内容，但我找不到缺少的内容。

感谢您花时间回答这个问题

工具

我在用

• Visual Studio Code vscode
• 角11

我尝试了什么？

• 我发现ctx包含的变量ngForOf包含从 Web 服务检索的数据（20 项）。

ctx.ngForOf

    { 
        "adult": false,
        "backdrop_path": "/pcDc2WJAYGJTTvRSEIpRZwM3Ola.jpg",
        "genre_ids": [
            28,
            12,
            14,
            878
        ],
        "id": 791373,
        "original_language": "en",
        "original_title": "Zack Snyder's Justice League",
        "overview": "Determined to ensure Superman's ultimate sacrifice was not in vain, Bruce Wayne aligns forces with Diana Prince with plans to recruit a team of metahumans to protect the …