1. Предпосылки

  • Вы ориентируетесь на устройства под управлением Android версии 5.0/API уровня 21 или новее или iOS версии 9.0 или новее.
  • Вы используете проект React Native, в котором работает React Native 0.34 или более поздней версии.
  • Убедитесь, что вы не используете какую-либо другую библиотеку, предоставляющую функции отчетов о сбоях на iOS.
  • Для iOS по умолчанию для использования SDK требуются CocoaPods. (Если вы не установили CocoaPods, следуйте инструкциям Начало работы с CocoaPods). Тем не менее, SDK можно связать вручную.

2. Создайте свое приложение на портале App Center, чтобы получить секрет приложения.

  • Зайдите на appcenter.ms.
  • Зарегистрируйтесь или войдите в систему и нажмите синюю кнопку в правом верхнем углу портала с надписью Добавить новое и выберите Добавить новое приложение в раскрывающемся меню.
  • Введите имя и необязательное описание для вашего приложения.
  • Выберите подходящую ОС (Android или iOS) и выберите React Native в качестве платформы.
  • Нажмите кнопку в правом нижнем углу с надписью Добавить новое приложение.
  • если у вас уже есть приложение и вы работаете в компании, у которой есть частное приложение, попросите вашего администратора или владельца стека предоставить вам разрешения.

3. Изменение вашей ветки

  • Прежде всего, вам необходимо создать 3 ветки: Develop, Stage и Master.
  • Develop означает, Debug Env, Stage означает UAT Env, а Master означает Production Env.
  • Каждую ветку мы настроим из файла сценария оболочки и добавим удаленную конфигурацию позже в центр приложений.
  • перед созданием любой автоматической сборки вы должны добавить сценарий оболочки для предварительной установки конфигурации центра приложений.
  • создайте файл в корневом каталоге и назовите его appcenter-post-clone.sh. или любое другое соглашение об именах, которое вы хотите, но расширение должно быть в сценарии оболочки.
  • добавьте этот код в файл ниже:
# This checks the pwd and in case that there is no BUILD_FLAVOR provided and the preinstall runs inside the runner, It should supply the BUILD_FLAVOR with value: dev
# Sure that this will only run on the PR checks.


if [[ "$PWD" == *"/runner/work/"* ]] && [ -z "$BUILD_FLAVOR" ]; then
  echo "exporting BUILD_FLAVOR with the value of `dev`"
  export BUILD_FLAVOR=dev
fi

if [[ $BUILD_FLAVOR ]]; then
  echo "APPLYING PRE INSTALL SCRIPTS 🤖 🤖 🤖"

  echo "Step 1: Get the pwd"
  pwd

  echo "Step 2: Change the file's permission"
  sudo chmod 600 $PWD/mobile.github.2022

  echo "Step 3: Run the ssh command"
  ssh-add $PWD/mobile.github.2022

  echo "Step 4: Update the ssh-agent"
  eval "$(ssh-agent -s)"

  echo "Step 5: Write the environment appConfig.ts"
  echo "import { devConfig, stageConfig } from './config-values';" >> ./src/config/index.ts
  case $BUILD_FLAVOR in
    "dev") echo "export const appConfig = devConfig();" >> ./src/config/index.ts
    ;;
    "stage") echo "export const appConfig = stageConfig();" >> ./src/config/index.ts
    ;;
    "production") echo "export const appConfig = liveConfig();" >> ./src/config/index.ts
    ;;
  esac
  echo "Step 6: The appConfig.ts is now: "
  cat ./src/config/index.ts
else
    echo "SKIPPING PREINSTALL SCRIPTS 💃 💃 💃"
fi
  • вставьте свой код в удаленный, а затем снова вернитесь в центр приложений.

4 . В этой части давайте автоматизируем жизненный цикл разработки вашего мобильного приложения:

  • После того, как вы выполнили все вышеуказанные требования, вам необходимо войти в центр приложений.
  • вы увидите список ваших приложений (Android / iOS), которые подписаны с вашим приложением.

5. Жизненный цикл Android-приложения:

  • Выберите приложение для платформы Android, и вы увидите в левом баннере некоторые элементы, такие как «Обзор», «Сборка», «Тестирование и распространение» и т. д.
  • Нажмите на сборку и найдите свою ветку.
  • После получения вашей ветки вы увидите самую левую кнопку с 3 точками, если вы пытаетесь настроить в первый раз, если вы уже выполнили настройку, вы увидите значок ключа, как на изображении ниже:

  • Нажмите эту клавишу, и вы увидите модальное окно, подобное этому модальному

  • Допустим, вы строите свою ветку из Master
  • Создание приложения:в варианте сборки вы можете выбрать между выпуском приложения и отладкой приложения, вы также можете выбрать версию js вашего узла, нажать «Автоматически увеличивать код версии», затем вы можете выбрать формат номера сборки. ID или Timestamp, обычно мы используем BUILD ID.
  • Переменные среды: добавьте имя как BUILD_FLAVOR и значение, основанное на вашей ветке, если вы работаете в Master, вам нужно добавить Prod как value, ветка Develop добавляет dev в качестве значения, ветка stage добавляет stage в качестве значения.
  • Подписать сборки: нажмите на нее, и вы увидите флажок, указывающий, что настройки My Gradle полностью настроены на автоматическую обработку подписи, просто включите его.
  • Распространить сборки:включите его, выберите группу и выберите пункт назначения.
  • Нажмите, чтобы сохранить, создать и наслаждаться Android Build.

6. Жизненный цикл приложения iOS:

  • Перед первой сборкой необходимо настроить проект React Native.
  • Выберите package.json вашего проекта. Центр приложений автоматически обнаружит связанный проект/рабочее пространство Xcode.
  • Выберите версию Xcode для запуска сборки из раскрывающегося списка. Если переключатель «Использовать устаревшую систему сборки» включен, то устаревшая система сборки будет использоваться независимо от настроек проекта или рабочей области. Если переключатель «Использовать устаревшую систему сборки» выключен, то будет использоваться конфигурация системы сборки из настроек проекта или рабочей области.
  • Триггеры сборки. По умолчанию новая сборка запускается каждый раз, когда разработчик отправляет в настроенную ветку. Если вы предпочитаете запускать новую сборку вручную, вы можете изменить этот параметр на панели конфигурации.
  • Увеличивать номер сборки: если этот параметр включен, CFBundleVersion в Info.plist проекта вашего приложения автоматически увеличивается для каждой сборки. Изменение происходит перед сборкой и не будет зафиксировано в вашем репозитории.
  • Подписание кода. Успешная сборка создает файл .ipa. Чтобы установить сборку на устройство, сборку необходимо подписать с помощью действительного профиля обеспечения и сертификата. Чтобы подписать сборки, созданные из ветки, включите подписывание кода на панели конфигурации и загрузите «профиль подготовки (файл .mobileprovision) и действительный сертификат (.p12) вместе с паролем для сертификата.
  • Настройки в вашем проекте Xcode должны быть совместимы с файлами, которые вы загружаете. Узнайте больше о Подписывании кода iOS в App Center и Документация для разработчиков Apple.
  • Распространить в группу рассылки. Настройте каждую успешную сборку из ветки для распространения в ранее созданную группу рассылки. Добавьте новую группу рассылки из раздела «Распространить». Всегда существует группа рассылки по умолчанию под названием «Соавторы», в которую входят все пользователи, имеющие доступ к приложению.
  • После сохранения конфигурации автоматически запустится новая сборка.

7. Результаты сборки:

  • Сборки могут находиться в одном из следующих состояний:
  • в очереди — сборка поставлена ​​в очередь в ожидании доступных ресурсов.
  • сборка — сборка запущена и выполняет предопределенные задачи.
  • успешно — сборка завершена успешно
  • failed — сборка завершилась неудачно; устраните неполадки, загрузив и просмотрев журнал сборки
  • отменено — сборка была отменена из-за действий пользователя или истекло время ожидания.
  • Наконец, попробуйте отправить новую фиксацию в репозиторий, App Center выполнит тест и создаст новую версию в соответствии с вашей конфигурацией, а затем уведомит ваших пользователей о необходимости загрузить только что созданную версию вашего приложения.
  • Ну, это было все о настройке CI / CD с App Center. Однако App Center имеет множество замечательных функций, таких как Analytics, Test Runs, Diagnostics, Push-уведомления, отчеты о сбоях и, самое главное, Codepush, который меняет правила игры для распространения приложений.
  • Надеюсь, теперь вы лучше понимаете CI/CD и можете настроить свою сборку с помощью App Center.