Инструменты для оптимизации рабочего процесса разработчиков при создании гибридных приложений Apache Cordova постоянно совершенствуются с момента появления интерфейса командной строки Cordova (CLI) несколько лет назад. Интерфейс командной строки значительно улучшил, автоматизировал и стандартизировал общие задачи разработки, которые ранее полагались на ручные процессы для создания или изменения файлов конфигурации или прямого манипулирования собственным кодом.
Поскольку Cordova имеет открытый исходный код, другие могут свободно использовать его и распространять свои собственные инструменты, адаптированные к конкретной среде JavaScript (например, Ionic) или для конкретных случаев использования (CLI Adobe PhoneGap добавляет возможность взаимодействовать с их облачными базами). сервис сборки PhoneGap).
Microsoft работает над тесной интеграцией экосистемы Cordova со своей линейкой продуктов Visual Studio, включая бесплатный кроссплатформенный редактор кода Visual Studio. В рамках этой инициативы Microsoft открыл исходный код TACO (Tools for Apache COrdova), альтернативный интерфейс командной строки, целью которого является дальнейшее повышение производительности труда разработчиков независимо от их выбора среды JavaScript или локальной платформы разработки.
TACO полностью совместим с обычным CLI Cordova, и вы можете без проблем использовать команды «taco» и «cordova» в одном проекте. Давайте посмотрим, какие преимущества могут ожидать разработчики на Mac OS от добавления TACO в свои наборы инструментов.
Установка
Предполагая, что у нас уже установлен Node.js, получить TACO просто:
sudo npm install -g taco-cli
Когда это будет завершено, мы можем убедиться, что TACO CLI установлен правильно:
taco -version
Что на момент написания должно выводить:
1.2.1
Создание приложения
Давайте продолжим и используем TACO CLI для создания приложения Cordova под названием «TACOApp» в папке «TACOApp» и с идентификатором приложения «com.moduscreate.tacoapp»:
taco create TACOApp com.moduscreate.tacoapp TACOApp
Это загрузит Cordova, если это необходимо (текущая версия на момент написания — 5.4.1), и создаст пустое приложение в «TACOApp».
Взглянув на то, что было создано для нас, мы видим:
ls -lF TACOApp -rw-rw-rw- 1 simon staff 6259 Apr 29 20:49 config.xml drwxr-xr-x 3 simon staff 102 Apr 29 20:49 hooks/ drwxr-xr-x 4 simon staff 136 Apr 29 20:49 merges/ -rw-r--r-- 1 simon staff 2 Apr 29 20:49 package.json drwxr-xr-x 2 simon staff 68 Apr 29 20:49 platforms/ drwxr-xr-x 2 simon staff 68 Apr 29 20:49 plugins/ drwxr-xr-x 5 simon staff 170 Apr 29 20:49 res/ -rw-r--r-- 1 simon staff 50 Apr 29 20:49 taco.json drwxr-xr-x 6 simon staff 204 Apr 29 20:49 www/
Это похоже на то, что мы ожидаем от обычного приложения Cordova, созданного с использованием Cordova CLI, с добавлением папки с именем «res» и файла с именем «taco.json».
«res» содержит некоторые шаблонные ресурсы для поддержки приложения Hello World, которое создает для нас интерфейс командной строки — значки, заставки и файлы конфигурации для конкретной платформы.
Файл taco.json сообщает TACO, какая версия CLI Cordova и какой набор (известный набор номеров версий плагинов, которые хорошо работают вместе) использовались при создании приложения. Подробнее о наборах TACO в документации.
Добавление платформ
Чтобы наше приложение работало на определенном семействе устройств, нам нужно добавить одну или несколько платформ Cordova. Давайте добавим Android и iOS и посмотрим, что здесь делает TACO по-другому:
taco platform add android
Это создаст и настроит платформу Android Cordova для нашего проекта, и когда это будет сделано, мы можем ожидать увидеть результат, похожий на:
Success! Platform(s) android added to the project.
Используя обычный рабочий процесс Cordova CLI, нам теперь нужно будет пойти и установить Android SDK и инструменты на правильных уровнях для версий Android, на которые мы ориентируемся, или сделать это отдельно до начала нашего проекта приложения.
В этом TACO CLI отличается от «ванильной» Cordova. Он поставляется с удобной дополнительной командой, которая может получить для нас эти специфичные для платформы SDK и требования.
taco install-reqs android
Это установит необходимые инструменты и SDK, которых еще нет на локальном компьютере, чтобы он был готов к созданию приложения.
Точно так же мы можем добавить поддержку платформы iOS в наше новое приложение с помощью:
taco platform add ios taco install-reqs ios
Как и в случае с обычным проектом Cordova CLI, папка нашего проекта теперь содержит:
platforms/android platforms/ios
Добавление плагинов
Плагины работают так, как вы ожидаете.
taco plugin add cordova-plugin-camera
добавит плагин камеры для всех установленных платформ с номером версии, установленным комплектом TACO, который использует приложение. Комплект — это набор подключаемых модулей, которые, как известно, хорошо работают с данной версией Cordova. Больше документации по этому здесь. Если вам определенно нужна последняя версия плагина, просто используйте:
taco plugin add cordova-plugin-camera@latest
Создание приложения локально
Чтобы создать приложение, мы просто сообщаем TACO, какую платформу мы хотим построить, так же, как мы использовали бы обычный интерфейс командной строки Cordova:
taco build android taco build ios
Они работают точно так же, как и в обычном проекте Cordova CLI.
Запуск приложения
Создав наше приложение, мы захотим запустить и отладить его как на реальном устройстве, так и с помощью эмуляторов. TACO также имеет некоторые дополнительные функции по сравнению с vanilla Cordova CLI.
Эмуляторы и устройства
TACO позволяет нам запускать наше приложение в эмуляторе, снова используя ту же команду, которую узнает любой знакомый с CLI Cordova:
taco emulate ios taco emulate android
Шаблонное приложение, которое генерирует TACO, визуально отличается от того, которое предоставляет обычный интерфейс командной строки Cordova, но имеет ту же логику обнаружения событий «deviceready». Шаблон TACO выглядит следующим образом:
TACO также позволяет разработчикам запускать свои приложения на устройствах, подключенных к их компьютеру, или на настроенном удаленном сервере сборки Mac для разработчиков Windows, желающих запустить приложение для iOS.
Предполагая, что мы на Mac и у нас подключено устройство iOS,
taco run ios
запустит приложение на подключенном устройстве и запустит его.
Живая перезагрузка
TACO позволяет нам запускать наше приложение (на устройстве или в эмуляторе) таким образом, чтобы мы могли изменять активы HTML / JS / CSS / изображения без необходимости выполнять еще один цикл сборки и эмуляции.
Обе команды запуска и эмуляции поддерживают перезагрузку в реальном времени (с использованием BrowserSync). Вот пример его использования с симулятором iOS:
taco emulate ios --livereload
Затем мы можем отредактировать исходный код приложения, и он будет перезагружен, когда мы сохраним наши изменения.
Синхронизация устройства
Еще одна функция, которую TACO предлагает по сравнению с vanilla Cordova CLI, — это возможность запускать приложение на нескольких устройствах и отображать события с одного на другом.
Это очень полезно при демонстрации или тестировании на разных платформах. Вот пример, где слева у нас есть iPhone, на котором запущено наше приложение, а справа — телефон Android Moto X, также работающий с ним. Это оба физических устройства. Их вывод фиксируется с помощью QuickTime для iPhone и отличного Vysor для Android.
Оба устройства должны быть подключены к вашему Mac, тогда включить это поведение так же просто, как:
taco run -device --devicesync
Live Reload также доступна во время синхронизации устройства, поэтому вы можете изменять файлы своего приложения и видеть изменения на обеих платформах одновременно. Синхронизация устройств также может работать с эмулятором для одной или обеих платформ, а не с физическими устройствами.
Вывод
Microsoft предлагает несколько полезных улучшений для разработчиков, работающих с Cordova. Будь то новый проект или улучшение рабочего процесса в незавершенном приложении, разработчикам следует более внимательно изучить TACO CLI.
Функции перезагрузки в реальном времени и синхронизации устройств значительно повышают производительность. Существует также возможность использовать удаленный сервер сборки, который позволяет разработчикам, работающим на компьютерах с Windows, участвовать в создании приложений, которые необходимо запускать на iOS. В этом кратком обзоре TACO мы не рассмотрели все его функции или интеграцию с кросс-платформенным редактором кода Visual Studio. Для получения более подробной информации мы рекомендуем вам ознакомиться с официальной документацией.
Какие инструменты вы используете для повышения производительности при создании приложений Cordova? Мы хотели бы услышать от вас. Если вы знаете кого-то, кто нашел бы эту статью информативной, пожалуйста, поделитесь! И подписывайтесь на меня в Twitter или Modus Create: Front End Development.
