React Naive之macOs环境配置记录(iOS Android)

一,iOS环境配置(mac os)

1.1 安装homebrew

Homebrew是OS X的套件(包)管理器，用于安装Node.js和一些其他必须的工具软件。定期更新brew：brew update 或者 brew upgrade（开发周期内，最好一天一次）

1 ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

1.2 安装nvm管理nodejs

1 安装nvm
2 nvm是node.js的版本管理器，可以用nvm来安装node.js
3 $brew install nvm
4 安装node
5 $nvm install node
6 也可以直接安装$brew install node
7 $node -v 查看node版本
8 $npm -v 查看npm版本

1.3 安装WatchMan

1 brew install watchman

1.4 安装Flow

1 brew install flow

1.5 React Native安装

安装完node后建议设置npm镜像以加速后面的过程（或使用科学上网工具）。注意：不要使用cnpm！cnpm安装的模块路径比较奇怪，packager不能正常识别！

1 npm config set registry https://registry.npm.taobao.org --global
2 npm config set disturl https://npm.taobao.org/dist --global

Yarn、React Native的命令行工具（react-native-cli）#
Yarn是Facebook提供的替代npm的工具，可以加速node模块的下载。React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务（packager）等任务。

1 $sudo npm install -g yarn react-native-cli 安装yarn
2 $sudo npm install -g react-native-cli 不安装yarn

安装完yarn后同理也要设置镜像源：

1 yarn config set registry https://registry.npm.taobao.org --global
2 yarn config set disturl https://npm.taobao.org/dist --global

1.6 安装xcode9.4.1

通过App Store下载
直接在 Mac 电脑上的 App Store 中搜索 Xcode 关键字，即可在搜索列表中看到它了，点击即可下载

Developer网站下载
登陆Developer网站，选择合适的版本下载。下载文件为.xip，双击解压后即可开始使用。

Xcode版本列表

1.7 创建react native项目

1 react-native demo --version 0.51.0

1.8 配置开发者证书

1,通过钥匙串生成iOS Development的类型证书

2,生成CertificateSigningRequest.certSigningRequest

3,导入生成iOS Distribution类型的证书，导入钥匙串。

4,选中Distribution签名生成*.mobileprovision,然后导入Xcode

5,Code Signing打包配置

PROJECT下的配置

TARGETS下的配置，需配置Development Team的值

托管平台

1.9 运行效果

ios打包配置流程与方式

https://jingyan.baidu.com/article/afd8f4de8210eb34e286e9ef.html

问题：

1,模拟器正常运行,xcode打包ipa安装在真机上,运行就闪退

原因与解决方法：

(1),当项目是Swift和OC混编的时候，在模拟器或者真机调试都正常运行，但是打包成ipa文件安装在手机上运行的时候启动就闪退：在Build settings里面找到Always Embeded Swift Standard Libraries选项，工程默认是NO，将其修改成YES问题就解决了

PROJECT下的配置

TARGETS下的配置

(2),钥匙串证书使用系统默认

二,Android环境配置(mac os)

2.1,安装sdk

去官网下载sdk

配置sdk环境变量

首先找出自己的SDK安装位置，我的Android SDK位置在：

1 /Users/a/Library/Android/sdk

1、打开终端，然后输入

1 ls -an

查看”.bash_profile”文件是否存在，如果存在就跳过第2步

2、创建环境变量配置文件

1 touch .bash_profile

3、打开并编辑配置文件

1 open .bash_profile

输入配置内容：

1 export ANDROID_HOME=/Users/a/Library/Android/sdk
2 export PATH=$PATH:$ANDROID_HOME/tools
3 export PATH=$PATH:$ANDROID_HOME/platform-tools

4、使配置生效

1 source .bash_profile

5、查看环境变量

1 echo $PATH

配置sdk下载

使用国内镜像下载：

大连东软信息学院镜像服务器地址:

http://mirrors.neusoft.edu.cn 端口：80 已测试，可以使用

打开sdk下载

2.2,安装jdk

去Java官网下载列表选择Mac OS X x64版

打开Finder,可以在下图所示的路径中找到安装好的jdk 1.8.0_40.jdk:

其中Contents下的Home文件夹，是该JDK的根目录。

配置jdk环境变量

1,输入“open -e .bash_profile”命令

2,输入如下配置：

1 JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_40.jdk/Contents/Home
2 PATH=$JAVA_HOME/bin:$PATH:.
3 CLASSPATH=$JAVA_HOME/lib/tools.jar:$JAVA_HOME/lib/dt.jar:.
4 export JAVA_HOME
5 export PATH
6 export CLASSPATH

3,使用”source .bash_profile”使配置生效

4,输入 echo $JAVA_HOME 显示刚才配置的路径

2.3,下载android studio

去官网下载

react-native Windows环境配置https://www.cnblogs.com/jackson-zhangjiang/p/8875967.html

2.4,效果

本文链接：https://www.cnblogs.com/jackson-zhangjiang/p/9661508.html

React Naive之macOs环境配置记录(iOS Android)