我们一起学React Native(一)：环境配置

最近想在项目中实现跨平台，对比一下主流的实现方式，选用了React Native。参考网上的教程，对于一直都是原生移动端开发，对前端的知识不是很了解的，感觉入门不是特别简单。于是打算把学习React Native的过程记录下来。

环境配置

基本参考React Native中文网搭建开发环境教程

搭建开发环境

安装流程就不详细写了，毕竟平台不同，系统原有软件的版本也不同，就算再详细下出来，也很难涉及全，可参考价值不大，况且React Native中文网写得很全面了。

我自己homebrew，Node，Android Studio之前都安装过了，基本不需要改动，就可以直接使用。网络方面，使用梯子，也一切顺利。

基本流程

1. 安装Homebrew
2. 用homebrew安装node
3. 安装Yarn，react-native-cli
4. 安装Xcode，macos都有
5. 安装Watchman
6. 安装Android Studio，Android SDK，Java环境，模拟器
7. 安装webstorm开发工具

输出版本号判断是否安装成功

➜  ~ brew -v
Homebrew 1.6.0
Homebrew/homebrew-core (git revision 47aeb6; last commit 2018-04-12)

➜  ~ node -v
v8.11.1

➜  ~ xcodebuild -version
Xcode 9.3
Build version 9E145

➜  ~ watchman -v
4.9.0

➜  ~ java -v
Unrecognized option: -v
Error: Could not create the Java Virtual Machine.
Error: A fatal exception has occurred. Program will exit.

➜  ~ java -version
java version "1.8.0_112"
Java(TM) SE Runtime Environment (build 1.8.0_112-b16)
Java HotSpot(TM) 64-Bit Server VM (build 25.112-b16, mixed mode)

编译项目测试运行环境

# 创建名称为AwesomeProject的项目
➜  ~ react-native init AwesomeProject
➜  ~ cd AwesomeProject
# 运行Android 项目
➜  ~ react-native run-android
# 运行IOS 项目
➜  ~ react-native run-ios

运行效果

看到Welcome to React Native，表示搭建开发环境，创建，运行React Native应用完成。为啥不是显示hello world呢！！！