Как работает сборка проекта¶

Запуск android в симуляторе¶

Сначала подготовить окружение согласно инструкции https://facebook.github.io/react-native/docs/android-building-from-source.html

Важно поставить в Android SDK следующие пакеты: Google Play Services (Extras), Google Repository (Extras).

Рекомендуется использовать пакет genymotion для запуска андроида. Там все довольно просто, ставится genymotion (лицензия для перс. использования). Далее по шагам:

Запускаем genymotion, скачиваем девайс (например Google Nexus 4) и запускаем его. Здесь можно посмотреть, где брать логи: https://docs.genymotion.com/Content/03_Virtual_Devices/Generating_virtual_device_logs.htm.
Чтобы установить на устройство Google Maps, пользуемся инструкцией http://stackoverflow.com/questions/20121883/how-to-install-google-play-services-in-a-genymotion-vm-with-no-drag-and-drop-su/20137324#20137324. В качестве google apps работает ссылка https://www.androidfilehost.com/?fid=96039337900114811, дополнительно придется руками доставить Google Maps.
Подготавливаем конфиг local.coffee, в котором прописываем вместо localhost свой айпи. Проблема в том, что симулятор работает в виртуалке и по локалхосту не попадет, куда нужно. Список конкретных параметров можно позаимствовать в файле development.coffee рядышком.
В папке проекта запускаем сборку npm run native.
В отдельной вкладке устанавливаем билд на телефон react-native run-android. При этом нужно дождаться, когда в предыдущей команде закончит собираться typescript и начнется сборка пэкеджером нэйтива. А то он увидит, что сервер не поднят и попробует в отдельной консоли его запустить. Если это случилось, нужно закрыть лишнюю консоль.

Запуск ios в симуляторе¶

Все по аналогии с android. Только симулятор ставить отдельно не нужно, его обеспечивает XCode. И ставить билд на телефон нужно командой react-native run-ios.

Для запуска эмулятора в другой версии iOS нужно:

Установить нужную версию ОС ➪ Xcode ➙ Preferences ➙ Components
Переименовать эмулятор устройства ➪ **Product ➙ Destination ➙ Add additional simulators... ➙ Select device ➙ Rename **
Запустить нужную версию ➪ react-native run-ios --simulator "%devicename%"

Примеры:: Запуск iOS 9.3 ➪ react-native run-ios --simulator "iPhone 6 9.3"

Запуск iOS 10.1 ➪ react-native run-ios --simulator "iPhone 6 10.1"

Сборка android версии для релиза¶

В основном все сделано в соответствии с инструкцией https://facebook.github.io/react-native/docs/signed-apk-android.html Gradle настроен таким образом, чтобы при сборке подписанного приложения брать ключи из Keychain access для пользователя ugputu. Поэтому пока собирать конечное приложение можно только с одной машины.

Сборка подписанного apk¶

В папке android проекта запускаем ./gradlew assembleRelease

Запуск релиз-версии на телефоне¶

В папке проекта запускаем react-native run-android --variant=release

Сборка ios версии для релиза¶

Пока делает Давид на своей машине.

Оптимизация сборки webpack¶

Команда для профилирования:

webpack --config project/webpack.config.coffee --app facade --profile --progress --stats --display-chunks --display-modules --json > profile.json

Ссылки на тему ускорения работы webpack¶

Как узнать, какие модули выносить в общий dll¶

В dev-server.coffee изменить настройки для webpack-dev-middleware следующим образом:

app.use(require('webpack-dev-middleware')(compiler,
  noInfo: false
  quite: false
  publicPath: config.output.publicPath
#  stats: 'errors-only'
))

Дальше запустить разработческий сервер npm start -- --app master и посмотреть на строчки, которые начинаются с /~/ — эти модули и есть кандидаты на вынос в DLL.

Статистика оптимизации webpack с помощью DLL¶

	До	Hot	После	Hot
admin
facade	18	4.9	8.5	1.0
master	44	7.8	31	3.1

Содержание

Вы здесь: