Firebase Studio предлагает несколько способов отладки приложения прямо в рабочей области. Для веб-приложений и приложений Flutter веб-консоль и Lighthouse интегрированы непосредственно в рабочую область. Для приложений Flutter доступен предпросмотр в браузере и на Android, чтобы вы могли проверять и тестировать приложение во время написания кода.
Для большинства распространенных языков также доступна более функциональная отладка на основе точек останова через встроенную консоль отладки. Ее можно расширить с помощью расширений отладчика из OpenVSX. Для отладки веб-кода интерфейса (например, JavaScript) на основе контрольных точек вы можете продолжать использовать встроенные инструменты разработчика вашего браузера, такие как Инструменты разработчика Chrome.
Как посмотреть предварительную версию приложения
В Firebase Studio доступен предпросмотр приложений в рабочей области для веб-приложений (Chrome) и приложений Flutter (Android, Chrome). Предварительные версии Android и Chrome поддерживают горячую перезагрузку и горячее обновление, а также предлагают полные возможности эмулятора.
Подробнее о Firebase Studioпредварительном просмотре в …
Как использовать веб-консоль при предпросмотре в браузере
Встроенная веб-консоль позволяет диагностировать проблемы в приложении прямо в режиме предпросмотра. Чтобы открыть веб-консоль на панели предварительного просмотра Firebase Studio, разверните панель внизу.
Обратите внимание, что это экспериментальная функция, которая по умолчанию отключена. Чтобы включить ее, выполните указанные ниже действия. После того как вы попробуете функцию, поделитесь своим мнением.
Добавьте веб-консоль в рабочую область Firebase Studio:
- Откройте Настройки, нажав на значок или сочетание клавиш
Ctrl + ,(в Windows, Linux и ChromeOS) илиCmd + ,(в macOS). - Найдите параметр Firebase Studio: инструменты веб-разработки и включите его. Если вы редактируете файл
settings.jsonнапрямую, добавьте в него"IDX.webDevTools": true. - Обновите окно браузера, чтобы перезагрузить рабочую область Firebase Studio.
- Откройте Настройки, нажав на значок или сочетание клавиш
Откройте предпросмотр в Firebase Studio. Для этого откройте панель команд (
Cmd+Shift+Pна устройстве с macOS,Ctrl+Shift+Pна устройстве с ChromeOS, Windows или Linux) и выберите Firebase Studio: Show Web Preview (: показать предпросмотр).По умолчанию панель веб-консоли свернута внутри панели предварительного просмотра. Нажмите на панель или перетащите ее вверх, чтобы развернуть.
Панель веб-консоли в предварительной версии Firebase Studio работает так же, как и другие консоли, например инструменты разработчика Chrome.
- По мере использования приложения в ней будут появляться ошибки JavaScript и операторы
console.log.- Если у вас возникли ошибки или предупреждения, вы можете получить помощь от Gemini, нажав кнопку Объяснить ошибку справа от сообщения об ошибке.
- Вы можете выполнить произвольный код JavaScript в контексте предварительного просмотра веб-страницы, используя строку запроса внизу.
Как создавать отчеты Lighthouse при предпросмотре в браузере
Lighthouse проверяет приложение по выбранным категориям и создает отчет с результатами и рекомендациями. Вы можете создавать отчеты Lighthouse непосредственно в режиме предпросмотра в браузере в Firebase Studio.
Откройте предварительный просмотр в Firebase Studio. Для этого откройте панель команд (
Cmd+Shift+Pна устройстве с macOS,Ctrl+Shift+Pна устройстве с ChromeOS, Windows или Linux) и выберите Firebase Studio: Show Web Preview (: показать предварительный просмотр).На панели инструментов в окне предпросмотра выберите значок
Run Lighthouse (Запустить Lighthouse).
На панели Lighthouse выберите нужные категории аудита. Вы можете выбрать отчеты, в которых анализируется производительность, специальные возможности, соответствие рекомендациям, поисковая оптимизация и производительность современных веб-приложений. Нажмите Анализировать страницу, чтобы создать отчеты.Создание отчетов может занять несколько минут.
После того как отчеты появятся на панели Lighthouse, вы можете изучить результаты для каждой категории аудита или переключаться между категориями, нажимая на оценку и название категории.
Как пользоваться консолью отладки
В Firebase Studio есть встроенная консоль отладки из Code OSS. Используйте эту консоль для отладки приложения с помощью встроенных отладчиков для наиболее распространенных языков программирования или добавьте расширение для отладки из OpenVSX.
Чтобы настроить отладку, вы также можете добавить файл .vscode/launch.json в рабочую область и указать собственные конфигурации запуска. Подробнее о том, как использовать файлы конфигурации запуска для настройки отладки в Visual Studio Code…
Отладка с помощью Gemini
Вы можете использовать Gemini для отладки кода в чате рабочей области Code или в App Prototyping agent.
Gemini может писать код, но иногда допускает ошибки. Когда он обнаруживает ошибку, он пытается ее исправить. Если вы обнаружите, что он не может решить проблему, учитывая сообщение об ошибке, вы можете попробовать некоторые из следующих методов:
Опишите проблему. В интерфейсе чата опишите проблему, с которой вы столкнулись, как можно более четко и кратко. Хотя у Gemini может быть доступ к контексту, например сообщениям об ошибках и журналам, он может не понимать его полностью. Опишите, что происходит, и укажите сообщение об ошибке. Это поможет Gemini быстрее устранить проблему.
Задавайте конкретные вопросы. Не бойтесь задавать Gemini прямые вопросы о своем коде. Например, "Что может вызывать исключение нулевого указателя в этой функции?" или "Как предотвратить это состояние гонки?".
Разбивайте сложные проблемы на части. Если вы столкнулись со сложной проблемой, разбейте ее на более мелкие и управляемые части. Попросите Gemini помочь вам отладить каждую часть отдельно и пошагово проанализировать проблемы.
Используйте блоки кода. При отправке фрагментов кода используйте блоки кода, чтобы обеспечить правильное форматирование. Это упрощает для Gemini чтение и понимание вашего кода.
Повторяйте и уточняйте. Gemini не всегда предлагает идеальное решение с первой попытки. Просмотрите ответы, задайте уточняющие вопросы и при необходимости предоставьте дополнительную информацию.
Избегайте зацикливания запросов. Если Gemini зацикливается или не может ответить на вопрос, попробуйте перефразировать запрос или добавить контекст. Иногда достаточно просто перефразировать вопрос, чтобы Gemini понял, что вы имеете в виду.
Если перефразирование запроса не помогает, попробуйте следующее:
Начните новый чат. Если вы используете чат Gemini в рабочей области Code, начните новый чат, чтобы сбросить контекст Gemini. Это поможет избавиться от любых заблуждений или предположений, которые Gemini мог сделать в предыдущем разговоре.
Приводите контрпримеры. Если Gemini делает неверные предположения, приведите контрпримеры, чтобы помочь ему понять, как действовать правильно.