Вам могут понадобиться эти команды и утилиты CLI для повседневных нужд разработки React Native.

React Native — отличная технология для создания мобильных приложений. Он поддерживается Facebook и широко используется такими компаниями, как Facebook, Shopify и т. д.

В этой статье будут перечислены несколько интерфейсов командной строки, которые разработчики React Native используют почти ежедневно.

1. Запустите Метро-сервер

Metro — это сборщик JS, который компилирует все файлы JS в один файл. Для запуска сервера метро напишите следующее:

react-native start
  # OR if you dont have react-native installed in machine
npx react-native start

2. Запуск на симуляторе/эмуляторе

Это команды для запуска React Native на симуляторе iOS или эмуляторе Android. Если на вашем компьютере не установлен react-native, добавьте npx раньше.

react-native run-ios 
 # Will open iOS Simulator
react-native run-android 
 # Will open Android Emulator

Чтобы открыть конкретный симулятор:

npx react-native run-ios — simulator= "iPhone SE (2nd generation)"
 # you can list available simulator via
xcrun simctl list devices

И чтобы открыть конкретный эмулятор Android:

npx react-native run-android --deviceId='DeviceId'
 # To get DeviceId
adb devices 
# Replace 9999xxx3434yyy as DeviceId
# List of devices attached
# 9999xxx3434yyy  device

3. Меню отладки Android

adb shell input keyevent 82

4. Чистый сторож

Watchman — это служба наблюдения за файлами, которая просматривает файлы и записывает или инициирует действия при их изменении.

watchman watch-del-all

5. Очистка модуля узла

rm -rf node_modules && yarn install && yarn cache clean
 # delete node modules, reinstall and then clean the cache

6. Очистка проекта iOS

cd ios && rm -rf Pods/ && rm Podfile.lock && pod install && cd ..
 # pod uninstall and then install

7. Старт пакета Fresh Metro

react-native start --reset-cache

8. Создайте пакет Android

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle && cd ./android && ./gradlew app:assembleRelease

9. Создайте пакет iOS

react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ios/main.jsbundle --assets-dest ios

10. Еще несколько скриптов

Вы также можете добавить эти скрипты в свой файл package.json, как показано ниже в разделе scripts:

"scripts": {
"clean": "watchman watch-del-all && rm -rf node_modules && yarn install && yarn cache clean && npx react-native link",
"androidClean": "cd android && ./gradlew clean && cd ../",
"resetCacheStart": "react-native start --reset-cache",
"devMenu": "adb shell input keyevent 82",
"iOSClean": "cd ios && rm -rf Pods/ && rm Podfile.lock && pod install && cd ..",
"cleanAll": "npm run clean && npm run androidClean && npm run iOSClean",
"prepAPK": "npx jetify && react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle && cd ./android && ./gradlew app:assembleRelease",
"PrepIPA": "npx react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ios/main.jsbundle --assets-dest ios",
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start"
},

Спасибо за прочтение. Удачного JavaScript. 🍻

Дополнительные материалы на PlainEnglish.io. Подпишитесь на нашу бесплатную еженедельную рассылку. Подпишитесь на нас в Twitter, LinkedIn, и Раздор.