ReactNative Android/iOS 打包详情流程

Android 端打包

使用 keytool 生成签名(也可以使用 androidstudio 生成签名)

 keytool -genkey -v -keystore mm.keystore -alias mm -keyalg RSA -keysize 2048 -validity 10000

配置签名文件

把签名文件发到项目名/android/app 目录下

在 android/gradle.properties 中加入

MYAPP_RELEASE_STORE_FILE=mm.keystoreMYAPP_RELEASE_KEY_ALIAS=mmMYAPP_RELEASE_STORE_PASSWORD=12345678 MYAPP_RELEASE_KEY_PASSWORD=12345678

在 android/app/build.gradle 添加

android {  ……  signingConfigs {      debug {          storeFile file(MYAPP_RELEASE_STORE_FILE)          storePassword MYAPP_RELEASE_STORE_PASSWORD          keyAlias MYAPP_RELEASE_KEY_ALIAS          keyPassword MYAPP_RELEASE_KEY_PASSWORD      }      release {          storeFile file(MYAPP_RELEASE_STORE_FILE)          storePassword MYAPP_RELEASE_STORE_PASSWORD          keyAlias MYAPP_RELEASE_KEY_ALIAS          keyPassword MYAPP_RELEASE_KEY_PASSWORD      }  }  buildTypes {      release {          signingConfig signingConfigs.release          minifyEnabled enableProguardInReleaseBuilds          proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"      }  }}

1. 执行打包命令(apk 输出目录项目名/android/app/outputs/apk)
```
 cd android & ./gradlew assembleRelease
```

iOS 端打包

1. 在项目名/ios 目录下添加 bundle 文件

为了方便打包，将打包命令配置到项目名/package.json

  {   "scripts": {       ……       "bundle-ios": "node node_modules/react-native/local-cli/cli.js bundle --entry-file index.js --platform ios --dev false --bundle-output ./ios/bundle/index.ios.jsbundle --assets-dest ./ios/bundle"   }, }

执行 npm run bundle-ios 命令打包

 在 项目名/ios/bundle 目录下，会自动新建以下文件    index.ios.jsbundle //离线js包   index.ios.jsbundle.meta   assets //资源文件夹，如果使用离线的 html 文件，         //打包的时候只会识别到js文件引用的文件，而 html 中引用的文件时不会打包到 assets 文件中，所以需要手动引用进来

1. 将 bundle 文件添加到项目里
- 打开 Xcode ，选中跟项目同名的那个文件夹，右键，选中‘Add Files to ..’选项
- 选择第一步新建的 bundle 文件夹，点击options，勾选 Create folder references 选项
- 将 bundle 文件添加到项目里（Xcode 中显示文件夹是蓝色的）

在 AppDelegate.m 中配置加载包的方式

 NSURL *jsCodeLocation; #ifdef DEBUG //debug   jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil]; #else //relese   jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"bundle/index.ios" withExtension:@"jsbundle"]; #endif

1. 准备好开发者账号，环境配置好，具体请看xcode打包IPA上传App Store完整流程
1. 配置 Xcode ，打包（以下和 iOS 原生打包一样）
- 修改为 release 模式，(Xcode-->Product-->Scheme-->Edit Scheme... 把 debug 改为 relese)
- 选择 Generic iOS Device ,修改 Version 和 Build
- 打包 (Xcode-->Product-->Archive 看提示操作)

ReactNative 常用命令

注：有一些控制台命令需要加上 ./ 有些不需要（gradlew clean ./gradlew clean），//项目根目录

命令	作用	平台
yarn / npm install	根据 package.json 更新 node_mofules (更新依赖)	Android/iOS
./gradlew clean	清除缓存（需要 cd android 到目录）	Android
./gradlew assembleRelease	打包apk （需要 cd android 到目录）	Android
yarn add xxx / npm install xxx	加入第三方库	Android/iOS
react-native link xxx	添加库需要的配置	Android/iOS
react-native run-android	运行调试Android	Android
react-native run-ios	运行调试iOS	iOS
react-native init xxx	新建项目	Android/iOS

Android 端打包

iOS 端打包

ReactNative 常用命令

更多相关文章

随机推荐