Overview
Earlier we introduced the development of React Native projects in the window environment. Today, we will talk about how to build an RN development environment on mac.
Configure the mac development environment
Basic environment installation
1. Install Homebrew first : for installing NodeJS and other tools.
Note: Homebrew is explained in detail, and I have skipped the understanding of this. I have not used mac for a long time. Here I will popularize it for Xiaobai.
Homebrew stands for Homebrew is the easiest and most flexible way to install the UNIX tools Apple didn't include with OS X. It is a package manager for installing some UNIX tools (such as the famous wget) that OS X does not have on the Mac. Homebrew installs all these tools into the /usr/local/Cellar directory and in /usr/local/bin Create a symbolic link in .
Install Homebrew:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"- 1
Then press Enter all the way and 
finally there is success, which means the installation is successful.
After the installation is complete, you can use the brew doctor command to detect whether there is any conflict. For other introductions about Homebrew, you can check the official website information by yourself.
Install Node.js
React Native requires NodeJS 4.0 or higher, and Homebrew's default Node package is version 6.0, so just install it directly:
brew install node- 1
Install React Native command line tool npm
We said before that npm is a package management tool, which is used to manage nodes. For details, please see npm's detailed
command-line tool to easily create and initialize projects:
npm install -g react-native-cli- 1
Note: If there is an error: EACCES: permission denied, use the command: sudo npm install -g React-native-cli.
Install Yarn
Yarn is an alternative to npm provided by Facebook to speed up the download of node modules. React Native's command-line tools are used to perform tasks such as creating, initializing, updating projects, running packagers, and more.
npm install -g yarn react-native-cli- 1
Other recommended installations
Watchman
Whtchman is a tool developed by Facebook to detect file system changes. In RN development, it can detect whether js files have changed, so as to achieve the effect of saving and compiling. This is also available in Windows. Personally, I think it can be installed or not. It is also possible to reload directly on the mobile phone.
brew install watchman- 1
Flow
static type checking tool
brew install flow- 1
Nuclide
A React Native integrated development environment (IDE) launched by Facebook, but I don't like it very much. I usually use the ide of webstorm+Android/ios.
Rapid development of React Native
Every time we learn a new language, we always like to have a helloWord.
react-native init HelloWord
cd HelloWord
react-native run-ios- 1
- 2
- 3
- 4
- 5
Note: You can also open iOS/HelloWord.xcodeproj in Xcode and click the Run button.
Tip: The react-native command line will have trouble dragging code from the official npm source. Please replace the npm repository source with Taobao's:
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global- 1
- 2
- 3
How to build the Android operating environment on mac is not explained here. You can read my previous article on the integration of React and Android . This article also supplements the previous RN development in the windows environment, but not under the mac. We will explain how to develop an RN application on the mac.