内容

Dart DevTools 是适用于 Dart 和 Flutter 的调试和性能工具套件。这些工具作为 dart 工具的一部分进行分发,并与 IDE、dart runwebdev 等工具进行交互。

Screenshot of DevTools' Memory page

下表显示了可与常见 Dart 应用类型配合使用的工具。

工具Flutter 移动或桌面Flutter Web其他 Web命令行
调试器完成完成完成完成
日志记录视图完成完成完成完成
应用大小工具完成完成
CPU 分析器完成完成
内存视图完成完成
网络视图完成完成
性能视图完成完成
Flutter 检查器完成完成

要了解如何对每种应用类型(例如命令行应用)使用 Dart DevTools,请单击顶行中的应用类型。要了解有关各个工具(例如调试器)的详细信息,请单击左侧列中的工具名称。

如表所示,调试器和日志记录视图是唯一适用于所有应用类型的 Dart DevTools 部分。Web 应用无法使用时间线、内存和性能视图;相反,它们可以使用浏览器工具,如 Chrome DevTools。 Flutter 检查器仅适用于 Flutter 应用;其他 Web 应用应使用浏览器工具,如 Chrome DevTools。

将 DevTools 与命令行应用配合使用

#

你可以使用 DevTools 执行源代码级调试,或查看正在运行的命令行应用的一般日志和诊断信息。

1. 启动目标应用

#

使用 dart run --observe 命令执行要调试或观察的 Dart 命令行应用的主文件。可以选择添加 --pause-isolates-on-start,它会在脚本开始时自动中断执行。

$ cd path/to/dart/app
$ dart run --pause-isolates-on-start --observe main.dart

The Dart VM service is listening on http://127.0.0.1:8181/afZySiNbDPg=/
The Dart DevTools debugger and profiler is available at: http://127.0.0.1:8181/afZySiNbDPg=/devtools/#/?uri=ws%3A%2F%2F127.0.0.1%3A8181%2FafZySiNbDPg%3D%2Fws

记下Dart DevTools 调试器和分析器 URL。你将在下一步中用到它。

2. 打开 DevTools 并连接到目标应用

#

复制Dart DevTools 调试器和分析器 URL,并将其粘贴到 Chrome 浏览器窗口的地址栏中。

当你访问 Chrome 中的该 URL 时,Dart DevTools UI 会出现,显示有关目标应用的信息。单击调试器以开始调试应用。

将 DevTools 与 Flutter 应用配合使用

#

有关在任何平台(包括 Web)上对 Flutter 应用使用 DevTools 的详细信息,请参阅 flutter.dev 上的 DevTools 文档。

将 DevTools 与非 Flutter 网络应用配合使用

#

要启动 Web 应用以便你可以使用 Dart DevTools,请使用带 --debug--debug-extension 标志的 webdev serve 命令

$ webdev serve --debug

有关更多信息,请参阅 调试 Dart Web 应用