Flutter DevTools
В DevTools уже есть сетевая вкладка, таймлайн, инспектор виджетов и профайлер памяти — и это Flutter-веб-приложение, которое отдаётся с вашей же машины. Поэтому Gitcito ничего из этого не переписывает и сам с Dart VM Service не разговаривает: он замечает адрес и встраивает его.
flutter run печатает строку, как только VM service поднялся:
The Flutter DevTools debugger and profiler on iPhone 16 Pro is available at:
http://127.0.0.1:9100?uri=http://127.0.0.1:53412/uJ8k=/
Сессия запуска следит за собственным выводом, и на панели отладки появляется кнопка. Клик открывает DevTools на самом репозитории, одним из его значков, а не отдельной вкладкой. По значку на сессию: два запущенных приложения это два DevTools.
Горячий перезапуск публикует новый адрес, и панель следует за ним, пока жива её сессия. Когда сессия исчезает, панель хранит последний адрес, обычно уже мёртвый: закройте значок и откройте DevTools из нового запуска.
Какие инструменты
Инструмент попадает сюда, если делает две вещи: отдаёт веб-интерфейс на этой машине и печатает свой адрес.
| Инструмент | Строка, которую он печатает |
|---|---|
| Flutter DevTools | The Flutter DevTools … is available at: <url> |
Dart DevTools (dart devtools) |
Serving DevTools at <url> |
Vue DevTools (@vue/devtools) |
Vue Devtools … listening on <url> |
| Prisma Studio | Prisma Studio is up on <url> |
| Drizzle Studio | Drizzle Studio is up and running on <url> |
| webpack-bundle-analyzer | Webpack Bundle Analyzer is started at <url> |
| всё остальное, где названы DevTools и адрес | попадает под общий шаблон |
Что встроить нельзя и почему. Инспектор Node печатает ws://-эндпоинт, к
которому цепляется отладчик, а не страницу, — а парный ему фронтенд Chrome
DevTools живёт за URL devtools://, который встроенному виду загружать нельзя.
Отдельная сборка React DevTools — это собственное окно приложения, а не отданная
страница. Ни то, ни другое здесь вкладкой быть не может: обоим нужен клиент
отладочного протокола, а не адрес.
Дев-сервер это не дев-тул. Vite на :5173 — это ваше приложение, и встроить
его значило бы сделать панель предпросмотра: другая функция, намеренно не эта.
Что ему позволено
Встроенный вид держат на коротком поводке — приложение хранит учётные данные:
- Только loopback.
127.0.0.1,localhost,::1. Встраивание любого другого адреса отклоняется, как и переход на него. - Никакого preload, node integration выключен, изоляция контекста включена. У страницы нет моста внутрь Gitcito.
- Ссылки открываются в настоящем браузере, в обычном окне, а не в панели.
Ограничения
- Это DevTools, а не наша поделка. Что умеет та версия, умеет и панель; чего не умеет — не умеем и мы. Сетевой вкладки «от Gitcito» нет.
- Так объявляется только Flutter. Обычная программа на Dart печатает URL VM service, но не адрес DevTools, — и кнопка не появляется.
- Пустая панель означает, что приложение остановилось. DevTools отдаёт работающее приложение; когда оно завершается, адрес перестаёт отвечать.
См. также: Запуск и отладка