Перейти к основному содержимому

Живой предпросмотр

Весь смысл AppX: опишите приложение, а затем получите настоящий результат. Панель предпросмотра даёт вам два вида вашего приложения — быстрый веб-предпросмотр для оперативных проверок и QR-код, который вы сканируете в Expo Go, чтобы запустить подлинное приложение на вашем реальном телефоне.

Когда вы применяете изменение, оно достигает телефона за секунды. Никаких ручных пересборок, никакого ожидания компиляции.

Два способа предпросмотра​

Веб-предпросмотр (мгновенный взгляд)​

Центральная панель отрисовывает ваше приложение внутри рамки телефона, прямо в браузере. Это самый быстрый способ взглянуть на вёрстку и стили, пока вы итерируете.

Это приближение, поэтому несколько вещей отличаются от реального устройства:

  • Только нативные функции — камера, тактильная отдача, датчики, нативные жесты — здесь недоступны.
  • Некоторые анимации и платформо-специфичное поведение отрисовываются иначе, чем на телефоне.
  • Шрифты и отступы могут немного отличаться.
подсказка

Используйте веб-предпросмотр для проверки вёрстки и стилей. Для настоящего результата — точных шрифтов, нативных функций, реальной производительности — отсканируйте QR-код и запустите приложение на телефоне.

Предпросмотр на устройстве (настоящий результат)​

Отсканируйте QR-код в Expo Go — и подлинное приложение запустится на вашем телефоне. Это полная достоверность: то же приложение React Native, которое получили бы ваши пользователи. После подключения каждая применённая правка обновляет ваш телефон автоматически.

Подключите телефон​

  1. Установите Expo Go:
  2. Откройте Expo Go и нажмите Scan QR Code (iOS) или значок сканирования (Android).
  3. Наведите его на QR-код в панели предпросмотра AppX.
  4. Ваше приложение загрузится на устройстве.

Первая загрузка занимает несколько секунд, чтобы скачать JavaScript-бандл. После этого правки прилетают мгновенно через Fast Refresh — повторно сканировать не нужно.

Если соединение когда-нибудь оборвётся, просто отсканируйте QR-код снова.

Как обновления достигают телефона​

Вы применяете правку
        ↓
AppX пишет новый код и проверяет его
        ↓
Обновление передаётся в ваше запущенное приложение
        ↓
Ваш телефон перезагружается на лету — обычно за секунды

Fast Refresh сохраняет ваше место: если вы на три экрана вглубь, когда прилетает изменение, вы там и остаётесь.

Когда предпросмотр мгновенный, а когда короткое ожидание​

Каждый проект работает в собственном живом окружении приложения. На платном тарифе вы можете держать его всегда включённым, поэтому предпросмотр мгновенный каждый раз. На тарифе Free простаивающее приложение засыпает, чтобы экономить ресурсы, и просыпается автоматически в следующий раз, когда вы открываете проект или сканируете QR — это пробуждение занимает несколько секунд.

Режим «всегда включён» входит в тарифы Premium и Pro. Смотрите Тарифы и Всегда включён.

Поделитесь ссылкой на предпросмотр​

Вы можете поделиться живым предпросмотром своего приложения с коллегой, клиентом или другом. Они сканируют QR в Expo Go и видят настоящее приложение на своём собственном телефоне — отлично для демонстраций и сессий ревью. Кастомные поддомены доступны на платных тарифах; смотрите Тарифы.

Вы также можете подключить несколько телефонов к одному проекту одновременно — тестируйте iOS и Android вместе или проводите живую групповую демонстрацию. Каждое подключённое устройство обновляется одновременно.

Устранение неполадок​

QR-код не сканируется

  • Убедитесь, что Expo Go обновлён.
  • Увеличьте яркость экрана.
  • Используйте опцию копирования ссылки и вставьте URL в Expo Go вручную.

«Unable to connect»

  • Убедитесь, что ваше приложение запущено (посмотрите на индикатор статуса в рабочем пространстве).
  • Обновите предпросмотр значком перезагрузки.
  • Если приложение спало, дайте ему несколько секунд проснуться, затем попробуйте снова.

Изменения не отображаются

  • Потрясите телефон в Expo Go и нажмите Reload.
  • Если это не помогает, отсканируйте QR-код заново.

Падает на телефоне, но в веб-предпросмотре выглядит нормально

  • Обычно нативная функция ведёт себя иначе на устройстве. AppX часто отлавливает и сообщает об этом в чате.
  • Опишите, что произошло — «приложение падает, когда я нажимаю кнопку камеры» — и ИИ это исправит.

Связанное​

Тестирование на устройстве

Настройка Expo Go, меню разработчика и отладка iOS против Android.

Всегда включён

Держите приложение бодрствующим, чтобы предпросмотр был мгновенным каждый раз.