xcode react
I just started learning React native by just following getting started, First I need to set up an environment for react native so I refer some blog and in all of them pointing towards one direct that I need an android studio. So in short when I setting up the Android development environment it requires me to install Android Studio then I was thinking Why I need to install Android Studio? I don’t want to code in java plus it requires a lot of memory space then I looking for an alternative whether I can use react native android without an android studio or not. same with IOS also.
我刚开始学习只是简单地跟着作出React本地起步 ,首先我需要设立一个环境React母语,所以我参考了一些博客,并在所有的人都指向一个直接的,我需要一个机器人工作室。 简而言之,当我设置Android开发环境时,它要求我安装Android Studio,然后我在想为什么要安装Android Studio? 我不想用Java编写代码,而且它需要大量的存储空间,所以我在寻找一种替代方法,是否可以在没有android studio的情况下使用react native android。 与IOS相同。
I’m using a mac (OS: Catalina), so this article will explain how to set up react native android/IOS in a mac environment.
我正在使用Mac(操作系统:Catalina),因此本文将介绍如何在Mac环境中设置react native android / IOS。
先决条件: (Prerequisite:)
- Android phone (Creating Android Virtual Device is not discussed in this article) Android手机(本文未讨论创建Android虚拟设备)
- genymotion (if you don't have android phone on hand) genymotion(如果您手边没有android手机)
遵循此步骤 (Follow this Steps)
STEP 1: Install Java JDK 8 (specific version 8 only)
步骤1:安装Java JDK 8(仅特定版本8)
Install via this command
通过此命令安装
brew tap adoptopenjdk/openjdk
brew cask install adoptopenjdk8
Existing users of Homebrew may encounter Error: Cask adoptopenjdk8 exists in multiple taps
due to prior workarounds with different instructions. This can be solved by fully specifying the location with brew cask install adoptopenjdk/openjdk/adoptopenjdk8
.
现有的Homebrew用户可能会遇到Error: Cask adoptopenjdk8 exists in multiple taps
由于先前使用不同指令的解决方法,因此Error: Cask adoptopenjdk8 exists in multiple taps
。 这可以通过使用brew cask install adoptopenjdk/openjdk/adoptopenjdk8
完全指定位置来解决。

After this setup java environment on your machine
在您的机器上设置Java环境之后
Check if /usr/libexec/java_home exists. If it does then try running
检查/ usr / libexec / java_home是否存在。 如果有,请尝试运行
export JAVA_HOME=`/usr/libexec/java_home`
and rerunning your Gradle build. If it works then make it permanent with
并重新运行您的Gradle构建。 如果可行,请永久使用
echo export "JAVA_HOME=\$(/usr/libexec/java_home)" >> ~/.bash_profile
STEP 2. Download and install Android SDK.
步骤2.下载并安装Android SDK。
Before you install android SDK you need to add your android SDK path to .bashrc or .zshrc, this path will be used during installation.
在安装android SDK之前,您需要将android SDK路径添加到.bashrc或.zshrc,此路径将在安装期间使用。
export ANDROID_HOME=/usr/local/share/android-sdk
Install android SDK by typing the code below in your terminal
通过在终端中键入以下代码来安装android SDK
brew cask install android-sdk
this operation will take some time (depending on your internet connection, please be patient) because it’s downloading the whole SDK.
此操作将花费一些时间(取决于您的Internet连接,请耐心等待),因为它正在下载整个SDK。
STEP 3. Install the required SDK
步骤3.安装所需的SDK
React native require android 6.0 (Marshmallow) and above to work with
React Native需要android 6.0(Marshmallow)及更高版本才能使用
- Android 6.0 (Marshmallow) SDK (platform 23) Android 6.0(棉花糖)SDK(平台23)
- Android build tool 23.0.1 Android构建工具23.0.1
- Google APIS 谷歌APIS
Install those required packages via terminal
通过终端安装那些必需的软件包
sdkmanager "platforms;android-23" "build-tools;23.0.1" "add-ons;addon-google_apis-google-23"
STEP 4: Create react native app
步骤4:建立React Native应用程式
Create a demo project
创建一个演示项目
react-native init DemoApp
cd DemoApp
You can run a demo project on your android phone or alternatively in android emulator using genymotion
您可以使用genymotion在Android手机或Android模拟器中运行演示项目
STEP 5. Run on andrid phone:
步骤5.在安卓手机上运行:
Plugin android phone (don’t forget to enable USB debugging)
插入Android手机(别忘了启用USB调试)
before that, you might need a watchman. so if you install via homebrew it will ask you to download Xcode for sure. without that, it won’t install. so as an alternative you can follow these steps.
在此之前,您可能需要一名值班员 。 因此,如果您通过自制软件安装,它将肯定会要求您下载Xcode。 没有它,它将无法安装。 因此,您可以按照以下步骤操作。
Download and extract the release for your system from the latest release
- It will be named something like watchman vYYYY.MM.DD.00-macos.zip 它将被命名为watchman vYYYY.MM.DD.00-macos.zip
unzip watchman-*-macos.zip
$ sudo mkdir -p /usr/local/{bin,lib} /usr/local/var/run/watchman
$ sudo cp bin/* /usr/local/bin
$ sudo cp lib/* /usr/local/lib
$ sudo chmod 755 /usr/local/bin/watchman
$ sudo chmod 2777 /usr/local/var/run/watchman
you might need to verify this app from the mac system setting because it’s not verified from the identified developer. then do,
您可能需要从mac系统设置中验证此应用 ,因为未从确定的开发人员中验证该应用 。 然后做,
react-native start
P.S. You can also try react-native run android. The react-native run-android
command might be optional if you do not want to deploy the android native code again (for instance, if you have not made any changes). You will have to launch the application manually and it will try to connect to the packager that starts with react-native start.
PS您也可以尝试react-native运行android。 如果您不想再次部署android本机代码(例如,如果未进行任何更改),则react-native run-android
命令可能是可选的。 您将必须手动启动该应用程序,并且它将尝试连接到以react-native start.
开头的打包程序react-native start.
It will take a while, it downloads gradle and other java dependencies for the first time. If the installation successful you will see the app show up on your phone.
这将需要一段时间,它将首次下载gradle和其他Java依赖项。 如果安装成功,您将在手机上看到该应用程序。
运行genymotion (Run on genymotion)
- install genymotion if you haven’t 如果没有安装genymotion
brew cask install genymotion
2. Set custom android SDK on genymotion Setting → ADB, set value to :
2.在genymotion 设置→ADB上设置自定义android SDK,将值设置为:
/usr/local/share/android-sdk
3. Add new virtual device then run it
3.添加新的虚拟设备,然后运行它
4. run react-native android command on your terminal, react native app will appear on your genymotion emulator
4.在终端上运行react-native android命令,react本地应用程序将出现在您的genymotion模拟器上
react-native android

在IOS上运行 (Run on IOS)
To run on IOS device you can follow this steps.
要在IOS设备上运行,您可以按照以下步骤操作。
npm install -g ios-deploy
# Run on a connected device, e.g. Max's iPhone:
react-native run-ios --device "Max's iPhone"
If you try to run run-ios
, you will see that the script recommends to do npm install -g ios-deploy
when it reach install step after building.
如果尝试运行run-ios
,您将在构建后到达安装步骤时看到该脚本建议执行npm install -g ios-deploy
。
or
要么
react-native run-ios --device
While the documentation on the various commands that react-native offers are a little sketchy, it is worth going to react-native/local-cli. There, you can see all the commands available and the code that they run — you can thus work out what switches are available for undocumented commands.
尽管react-native提供的各种命令的文档有些粗略,但是值得去react-native / local-cli 。 在这里,您可以看到所有可用命令以及它们运行的代码,因此可以算出哪些开关适用于未记录的命令。
Thanks for reading, give some ❤️ if you like this article.
感谢您的阅读,如果您喜欢这篇文章,请给我一个❤️。
Stay Safe and Hunt Hard ❤️
保持安全并努力狩猎❤️
xcode react