React Native从零开始构建项目(2019)

环境搭建,参考官网
安装 Xcode Android Studio
目的,实现本地热重载开发,使用vsCode
运行失败,重新执行react-native init Demo
//生成 ios 离线包
mkdir release_ios
react-native bundle --entry-file index.js --platform ios --dev false --bundle-output releaseios/index.jsbundle --assets-dest releaseios/
删除多余 target 包,再打包即为离线包
//生成 android 离线包
安卓生成秘钥:
keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000
口令:my-key-alias
姓: 李
单位: 赛尔
组织:赛尔
区域:北京
省:北京
代号:86
参考:
cd 到 android 目录,运行
./gradlew assembleRelease
下面目录有安卓包
/app/build/outputs/apk/
热更新
选择应用
pushy selectApp --platform ios/android
发布ios应用
pushy uploadIpa <your-package.ipa>
发布安卓包
pushy uploadApk android/app/build/outputs/apk/release/app-release.apk
发布热更新
pushy bundle --platform <ios|android>
官方网站
安装 react-navigation
react-native-vector-icons 图标
自定义字体图标
node_modules/react-native-vector-icons目录
安卓报错
错误: 程序包android.support.v4.util不存在
ReactNative三方组件汇总
保证安卓和ios风格统一
集成redux
谷歌浏览器调试js
css屏幕适配
去掉底部关于remote debugger黄色提示
启动图
yarn add react-native-splash-screen  
注意!:ios需要cd ios/,  运行pod install下载库, 然后building setting -> header search paths -> 添加 "${PODS_ROOT}/Headers/Public/react-native-splash-screen
    AppDelegate.m添加代码  
     #import "RNSplashScreen.h"    //引入头文件
     ...
     [self.window makeKeyAndVisible];
     [RNSplashScreen show];   // 启动后进入启动页
     return YES;
     ...
每次安装完插件,node_modules文件字体文件会丢失,执行
cp android/app/src/main/assets/fonts/IconFont.ttf node_modules/react-native-vector-icons/Fonts/
本地存储
yarn add @react-native-community/async-storage
posted @ 2019-11-19 16:12  Groove明阳  阅读(314)  评论(0编辑  收藏  举报