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

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,效果

猜你喜欢

转载自www.cnblogs.com/jackson-zhangjiang/p/9661508.html