现阶段使用rn进行跨平台一体化开发的比较多，RN开发给移动开发提供了新的方向，简单通用的语法和开发打包的简洁，越来越被大众所推崇，本人作为一个还处于小菜鸟阶段的开发人员，在接触的时候踩了很多坑，这里做一下简单的记录，希望可以帮助一些和我一样还在爬的新手们。话不多说，开始我们的踩坑之旅吧！

创建react-native项目

环境问题这边不多做介绍，必要（node，npm/yarn）

创建方式（CRNA）

react-native有两种开发方式，一种是使用原生Android/Ios混合起来的开发方式，另一种是使用antdesign推崇的create react native app简称（CRNA），因为我当前使用的是第二种，所以这边先详细介绍CRNA方式的开发模式。稍后的文章再介绍原生混合开发模式。

安装create-react-native-app

create-react-native-app是一个综合创建ReactNative工程，并且不需要配置的工具，它极大的简化了入门开发的流程。安装create-react-native-app需要使用npm进行，输入以下命令安装:

  1. npm install -g create-react-native-app

创建新工程

使用create-react-native-app模式创建RN项目是运行在expo client上的，所以这里需要如下你需要大致了解一下什么是expo，以及阅读一下相关文档， expo 官网 expo 文档

安装完成后你可以使用 create-react-native-app 新创建的空项目也可以使用AntDesign的官方实例中直接拷贝，在它的基础上修改。

  1. create-react-native-app my-app

运行工程

1.使用expo运行项目输入如下命令，运行成功后生成一个二维码和一个本地链接，通过此此二维码或本地链接，便可预览工程运行效果

  1. yarn start  
  2. // yarn start android
  3. // yarn start ios

2.启动工程之后，需要在手机端安装Expo App，使用Expo App对所开发的ReactNative App进行预览运行。ios可以直接在AppStore中下载，安卓就有点麻烦了，需要在googleplay中下载（可以下载Google 安装器），并且授予最高权限，下载完成后就可以扫描二维码进行测试

测试工程

真机测试的时候，摇一摇手机打开调试模式这里对两点需要⚠️注意 （1）Hot Reloading Unavailailable：该选项是开启热加载， 也就是在修改代码保存刷新后真机测试会实时更新。 （2）Debugging In Remote ：该选项是使用浏览器远程调试，可以实现真机测试的同时查看代码以及接口数据的返回，方便进行数据的处理。

发布工程

安装exp

打包需要依赖exp现在更新版本使用expo-cli

  1. 旧版：npm install -g exp
  3. 新版：npm install -g expo-cli

登录expo帐号

account 登录

生成apk和ipa程序包

Android:

  1. 旧版：exp build:android
  3. 新版：expo build:android

iOS:

  1. 旧版：exp build:ios
  3. 新版：expo build:ios

打包完成后会生成一个下载路径，可以comment+单击路径下载，也可以复制链接直接下载

生成可安装程序

安卓可以直接安装apk但ios需要生成测试二维码就能安装，使用蒲公英是很好的一个应用发布工具 将对应的apk和ipa 文件进行上传 版本号可以使用蒲公英自增版本或者使用build的版本号，自选