Run any iOS Simulator on React-Native 📲

Script header

Sooner or later the question arises:

How to change the iOS simulator in React-Native without committing the changed code or without multiplying a bunch of new commands in the packages.json

yarn env ios
When the simulator did not exist

Requires three stage/files:

  1. packages.json
  2. .env
  3. iOS.sh

🛠 packages.json

React-Native not understand iOS device type, but we can use unique iOS-name and iOS-version

"env": "ENVFILE=.env yarn ${1}",
"ios": "source iOS.sh; react-native run-ios --simulator=\"$iOSname ($iOSversion)\"",
  • .env → it’s makes life better because you can have several different files with settings like for development or stage
  • source iOS.sh → after source, write the path to the script: iOS.sh

🛠 .env

File must have this three strings:

iOSname=React-Native Dev_15.0
iOSdevice=iPhone 12 Pro Max
iOSversion=15.0

What you write after the ‘=’ sign is your business, but is everything you need really supported by your Xcode? You can check and select the settings you need:

xcrun simctl list
Choose iOSdevice

iOSname —my recommendation, give the name as a project and add something like Dev, and the OS-version (see issue below)

iOSname=React-Native Dev_15.0

iOSdevice — you can write one of them (see issue below)

iOSdevice=iPad Pro (12.9-inch) (3rd generation)
iOSdevice=iPad-Pro--12-9-inch---3rd-generation-

iOSversion this is used to create and run the Simulator, but not to check created Simulator (see issue below)

iOSversion=15-0
iOSversion=15.0
Chose install iOS-version

🛠 iOS.sh

Download and put in your project-folder

GitHub-Project

This script has simple logic. Each time he closes all the simulators, checks the existing simulator by iOSname in .env-file and, if necessary, creates a given simulator from the .env-file, and only then allows the React-Native to run the project on the right simulator.

✍️ Issue

  • By default, React-Native uses iPhone 11 (Documentation)
  • React-Native understand only iOSName and iOS-version
  • React-Native not understand iOSdevice-type
  • Logic of script not understand different iOS-version and iOSdevices-type (Logic based on iOSName)
  • `xcrun simctl list` — not show iOS-versions and iOSdevices-type (Only iOSName, UUID and Status)
  • `applesimutils --list` — shows more information, but needs to be parsed (Script will be huge)
  • I recommend writing some iOSdevices without parentheses and from the list from the last part (Like iPad Pro (12.9-inch) or iPad Pro (12.9-inch) (5th generation))
  • iOS-simulator running with Xcode → Xcode work on macOS (It’s wise solution)
  • Please write the correct data in your .env file

Conclusions:

You should keep your work clean so that those who will support the project after us — did not have to rewrite it from scratch 👾

P.S. If you liked this article, add me to friends and if possible — Support Me 💳
👽 Patreon or 👻 PayPal

You can Сontact Мe 👉🏻 LinkedIn //=// GitHub //=// StackOverFlow

Work is a tool for achieving dreams…