我有一个HTML5应用程序，通过点击链接在新窗口中打开。每次我想要记录网络通信以启动开发者工具时，都需要不断按下Shift + I，感到有些疲倦，因为我总是需要它。我找不到一个选项来在启动时始终启用开发者工具。
是否有任何方法可以在Chrome中自动打开开发者工具，当新窗口被打开时？
当打开新标签页/新窗口时自动打开Chrome开发者工具
408
- Alexander Sirobaba
7
1我也很想知道这个。我找到的唯一方法是像这个人那样编辑源代码：[链接]https://groups.google.com/forum/?fromgroups=#!topic/google-chrome-developer-tools/HhwKHUryNaA - zone117x
我已经努力搜索了很久，最接近的方法是使用Chrome扩展程序在开发工具中创建一个新的面板。 - TankorSmash
2使用Python的SendKeys功能，您可以启动Chrome并发送“+^j”以模拟Ctrl Shift J，但这仅适用于新实例；为了导航到给定页面，您需要使用Selenium或其他一些更有创意的方法... - TankorSmash
1是的，我也看到了这个变体，但当你想要为每个新打开的选项卡打开开发工具时，它并不适用。 - Alexander Sirobaba
1此功能于2016年添加。请参见此处：https://bugs.chromium.org/p/chromium/issues/detail?id=410958#c81 - Rimian
显示剩余2条评论
17个回答
406
打开开发者工具，在开发者工具窗口中，按下 F1 键。这将打开一个设置页面。勾选“自动打开弹出窗口的开发者工具”。
这对我起作用了。
这对我起作用了。
- Saint
10
23这个方法很有效，完全符合提问者的要求，应该标记为正确答案。 - Rui
2在WebStorm中对我也不起作用。页面打开了，但没有开发工具。 - Mörre
4这个功能可用，但“保留日志”选项始终未被选中，如果弹出窗口重定向，则不会显示之前的网络请求。有什么办法可以使它默认保留日志吗？ - timetofly
3这仅适用于特定的一些情况，请参见 https://bugs.chromium.org/p/chromium/issues/detail?id=410958#c87。它不是一个通用解决方案。 - Lane Rettig
3在使用 Chrome 调试扩展程序的情况下，从 VS Code 启动时无法工作。 - VanAlbert
显示剩余5条评论
145
有一个用于此的命令行开关：--auto-open-devtools-for-tabs
因此，在Windows上，对于Google Chrome快捷方式的属性，请使用类似以下内容的命令：
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --auto-open-devtools-for-tabs
以下是一个有用的链接：chromium-command-line-switches。
根据DevTools文档，以下是每个平台从命令行执行的命令：
MacOS：
open -a "Google Chrome" --args --auto-open-devtools-for-tabsWindows：
start chrome --auto-open-devtools-for-tabsLinux：
google-chrome --auto-open-devtools-for-tabs
- David
9
2这肯定有效，现在应该标记为已接受的答案。在
Chromium Version 50.0.2661.102 Ubuntu 15.10 (64-bit) 上进行了检查，并像这样打开它 chromium-browser --auto-open-devtools-for-tabs。 - Olga9这在 Windows 7 版本 51.0.2704.103 m 上不起作用。 - Peter
11在 OS X 系统中，完整的命令为（首先退出任何正在运行的 Chrome 进程）：
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs。 - Lane Rettig4在版本59.0.3071.115（官方构建）（64位）上无法工作。 - Gustavo Straube
4在尝试此操作之前，请记得退出所有Chrome实例。否则，此操作将无法正常工作。 - Rick
显示剩余4条评论
123
更新2：
请参见此答案。 - 2019-11-05
如果您在打开弹出窗口时已经打开了开发者工具，则现在还可以自动打开它们。例如，如果您没有打开 Dev Tools 并且您收到一个弹出窗口，则不会打开 Dev Tools。但是，如果您已经打开了 Dev Tools，然后再单击某个内容，弹出窗口将自动打开 Dev-Tools。
更新：
时代在变化，你现在可以使用 --auto-open-devtools-for-tabs，如这个答案 - Wouter Huysentruit May 18 at 11:08
原帖：
我尝试使用 Chrome 的启动字符串进行实验，但无法使其持续到新标签页。
我还考虑过一种定义的 PATH 方法，即您可以从提示符中调用。这是可能的 SendKeys 命令，但同样只适用于新实例。而 DevTools 不会持续到新选项卡中。
在 Google 产品论坛上浏览，似乎没有内置的方法可以在 Chrome 中执行此操作。您将不得不使用按键解决方案或如上所述的 F12。
我建议它作为一个功能。我知道我不是第一个。
- Chiperific
5
1@Seanny123：已修复！如果您希望将此作为一个功能，请随意给这个Chromium bug点赞：https://code.google.com/p/chromium/issues/detail?id=410958 - phsource
1@Chiperific，你说你正在尝试在执行时调整Chrome的启动字符串，但无法使其持久化到新标签页。我只需要在启动时为一个标签页实现这种行为。你能分享一下只针对一个标签页实现的方法吗？ - Martin Braun
2请考虑编辑您的答案。在 SO 上它已经过时，但仍然非常明显。 - yannick1976
7在 OS X 操作系统中，完整的命令为（先退出任何正在运行的 Chrome 进程）：
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs。 - Lane Rettig38
在 Mac 上：退出 Chrome，然后在终端窗口中运行以下命令：
open -a "Google Chrome" --args --auto-open-devtools-for-tabs
- Erin Mills
1
4澄清一下：这将使用设置了
auto-open-devtools-for-tabs旗帜的方式打开Chrome。退出Chrome并使用普通应用程序快捷键重新打开它将不会使用该旗帜。如果您想要一个快捷方式，在不必打开终端窗口的情况下使用此标志打开Chrome，您可以在Automator中创建一个工作流，添加“运行Shell脚本”项目，并粘贴上述脚本。将工作流保存为应用程序将创建一个可点击的应用程序。请参见另一个主题中的此答案：https://dev59.com/sHVC5IYBdhLWcg3weBA-#281455 - Rick Gladwin23
在 Chrome DevTools 设置中，您需要启用：
在 Network 下的 Preserve Log 选项， 在 DevTools 下的 Auto-open DevTools for popups 选项。
- Andrew Patterson
4
我个人认为最佳答案是： - Chase Miller
3很好的回答，但是针对Linux系统进行解释：进入开发者控制台。点击汉堡菜单。点击设置（或F1）。在网络部分勾选保留日志。在开发工具部分勾选自动打开弹出窗口的开发工具。 - JDPeckham
5在MacOS上的Chrome 85中，现在它在“设置” -> “全局”部分下。 - Konstantin Gatilin
这个答案与 https://dev59.com/72ct5IYBdhLWcg3wQ7bP#38366206 相同。 - icc97
18
在开发者工具窗口可见的情况下，点击菜单图标（在右上角的三个竖点）并点击设置。
在开发工具下，勾选自动打开弹出窗口的开发者工具选项
- luhuiya
2
6Chrome版本86的设置在同一位置，但名称不同，因此： 设置->首选项->全局->自动打开用于弹出窗口的开发工具。 - Бранко Пејић
这个答案与 https://dev59.com/72ct5IYBdhLWcg3wQ7bP#38366206 相同。 - icc97
14
2021年的答案：
- 打开开发者工具（在Windows上按 CTRL+SHIFT+I）
- 点击“齿轮”图标，会弹出新的设置窗口。
- 现在，“自动打开用于弹出窗口的开发者工具”在“首选项”部分中。
- randolfarevalo
2
这个答案与 https://dev59.com/72ct5IYBdhLWcg3wQ7bP#38366206 相同。 - icc97
因为抄袭答案而被踩。 - codepleb
11
如果你使用Visual Studio Code (vscode)，可以使用非常流行的vscode chrome debug扩展(https://github.com/Microsoft/vscode-chrome-debug)来设置启动配置文件
这是我用于React项目的
launch.json，并指定在调试会话期间打开开发者工具。这是我用于React项目的
launch.json:{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:3000",
"runtimeArgs": ["--auto-open-devtools-for-tabs"],
"webRoot": "${workspaceRoot}/src"
}
]
}
重要的一行是"runtimeArgs": ["--auto-open-devtools-for-tabs"],
现在你可以在VSCode中输入F5，Chrome将打开你的应用程序和控制台选项卡。
- vincedgy
2
适用于Linux（Ubuntu 22.10 / Gnome） - code_monk
9
F12 比 Ctrl+Shift+I 更简单。
以下是所有 DevTools 快捷键：
| 操作系统 | 元素面板 | 控制台面板 | 上次使用的面板 |
|---|---|---|---|
| Windows 或 Linux | Ctrl + Shift + C | Ctrl + Shift + J | F12 Ctrl + Shift + I |
| Mac | Cmd + Option + C | Cmd + Option + J | Fn + F12 Cmd + Option + I |
- Yehia
3
2如果您使用的是Windows或Linux操作系统 - Gianfranco P.
2在MacBook或Pro上按F12键需要执行fn + f12（左下角极限 + 右上角极限），这对大多数键盘用户来说并不方便。 - Seth McClaine
在Linux上运行得非常好...这是切换的另一个原因。在Mac Pro上完成了它，虽然不完美，但仍然比Apple OS要好得多。 - Ray Foss
5
在命令行中运行 Chrome 时，使用 --auto-open-devtools-for-tabs 标志。
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs
- Robin
4
1谢谢，它在我的电脑上运行。前提是所有相应的浏览器进程必须先关闭。 - Andy
这个答案与 https://dev59.com/72ct5IYBdhLWcg3wQ7bP#36957422 相同。 - icc97
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接