前言：从前端的发展历程上看，从切图仔到全端，注定有舍有得，边界会越来越大，技术会越来越丰富，贯穿浏览器、服务端和移动端多元化发展趋势。花了一天时间纠结用HTML5+和RN来开发安卓ios双端，考虑稳定性选择用RN，做好被虐上整整一个月的心理准备，开发过程中事实也确实如此，坑多慎入。
另外建议当决定要用RN重构应用或者基于RN开发时，尽量提前梳理业务文档，有条件先组预研发小组，去研究业务实现的可能性，比如说集成外部的sdk，切记原生部分最好要求配合安卓ios朋友一起合作，否则会很难受。
从技术角度，入坑先从vue跳到react，再入react-native。此文章主要记录项目开发中填坑过程。
RN开发环境
- 安卓开发环境
https://reactnative.cn/docs/getting-started/
安装的依赖有：Node 10+，JDK1.8 ，python 2.7，yarn（代替npm），Android Studio（安卓开发工具）用于模拟器打开项目 - ios开发环境
安装的依赖有：Node、Watchman 和 React Native 命令行工具以及 Xcode。
创建项目
react-native init 项目名
tip:react-native 版本更新较快，init默认是最新版本的react-native，目前最新发布版本0.60.0版本（更新修复，支持androidX，完全删除了WebView，Geolocation...），也可根据需要创建指定版本RN：
react-native init 项目名 --version 0.59.9
进入项目目录查看react-native版本 ：react-native -V
在设备中启动项目
-
安卓设备
模拟器启动：Android studio中打开项目中android文件夹，点击操作栏图标（类似手机），先创建自己的模拟器
15402667-006bf76a3ad7e346_副本.png
接着在项目目录下，命令行服务端口react-native start
点击启动按钮，选择模拟器就可启动项目
真机启动：用usb连接电脑和手机（手机必须在开发者选项下，打开usb调试模式，否则启动会报错），在项目目录下，命令行启动：
react-native run-android
App安装完成，node窗口进度条走完即可在手机上运行RN项目。
模拟器与真机开发者菜单主要用到：Reload （重载），Debug JS Remotely(Debug 调试模式，可在浏览器中console.log输出)，Enable Hot Reloading(热更新)；
开发者菜单打开方式：
模拟器：ctrl+m ， r+r(为reload)
真机：手机摇一摇，或者左键长按
- ios设备
xcode打开ios目录下***.xcodeproj，左上角选择模拟器类型，点击运行，即可在模拟器中运行RN应用，另外在外部设备运行需要开发者账号。
RN项目依赖
根据项目需要可选择安装依赖插件，示例项目依赖
"@react-native-community/async-storage": "^1.4.2", //本地存储
"@react-native-community/netinfo": "^3.2.1",//断网处理
"@react-native-community/viewpager": "^1.1.7",
"prop-types": "^15.7.2",
"react": "16.8.3",
"react-native": "0.59.9",
"react-native-baidu-map": "1.0.2",//百度地图
"react-native-camera": "^2.10.2",//摄像头扫码功能
"react-native-easy-toast": "^1.2.0",//toast 轻提示
"react-native-fit-image": "^1.5.4",//自动适应图片
"react-native-flexi-radio-button": "^0.2.2",//radio
"react-native-gesture-handler": "^1.3.0",//手势
"react-native-image-picker": "^0.28.1",//上传图片
"react-native-linear-gradient": "^2.5.4",//渐变颜色
"react-native-modal": "^11.0.1",//modal弹窗
"react-native-modal-dropdown": "^0.6.2",//下拉弹框
"react-native-permissions": "^1.1.1",//权限
"react-native-qrcode-svg": "^5.1.2",//二维码
"react-native-render-html": "^4.1.2",//html内容渲染
"react-native-scrollable-tab-view": "^0.10.0",//tab切换效果
"react-native-splash-screen": "^3.2.0",//启动屏
"react-native-svg": "^9.5.1", //图形支持
"react-native-swiper": "^1.5.14",//轮播
"react-native-textarea": "^1.0.3", //多行输入
"react-native-vector-icons": "^6.5.0",//图标库
"react-native-webview": "^5.12.1",//webview
"react-navigation": "^3.11.0",//导航
"react-navigation-redux-helpers": "^3.0.2", //集成redux必须集成此库
"react-redux": "^7.1.0", //react官方提供的 React 绑定库
"redux": "^4.0.1"//JavaScript 状态容器，提供可预测化的状态管理
依赖安装方法：
yarn install //安装全部依赖
yarn add 依赖名 //安装单个依赖
yarn add 依赖名@版本号 //安装依赖某个版本
yarn remove 依赖名 //删除依赖 ，删除依赖后，需要把安卓ios原生文件中删除依赖
需要依赖原生库
react-native link 依赖内一次性全部链接
react-native link 依赖名 链接某一个库
假设，根据项目需要修改了依赖包源码，在项目根目录复制修改源码的包，
在pagejson.json文件修改文件安装路径。
