1. Android 打包

第一步:生成Android签名证书

签名APK需要一个证书用于为APP签名，生成签名证书可以Android Studio以可视化的方式生成，也可以使用终端采用命令行的方式生成。

第二步：设置gradle变量

1.将你的签名证书copy到 android/app目录下。
2.编辑~/.gradle/gradle. properties或../android/gradle.properties(一个是全局gradle.properties，一个是项目中的gradle.properties，大家可以根据需要进行修改) ，加入如下代码：

MYAPP_RELEASE_STORE_FILE=your keystore filename  MYAPP_RELEASE_KEY_ALIAS=your keystore alias  MYAPP_RELEASE_STORE_PASSWORD=*****    MYAPP_RELEASE_KEY_PASSWORD=*****

提示：用正确的证书密码、alias以及key密码替换掉 *。

第三步：在gradle配置文件中添加签名配置

编辑 android/app/build.gradle文件添加如下代码：

...  android {          ...          defaultConfig { ... }          signingConfigs {              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                  }              }  }  ...

第四步：签名打包APK

terminal进入项目下的android目录，运行如下代码：./gradlew assembleRelease

签名打包成功后你会在 “android/app/build/outputs/apk/”目录下看到签名成功后的app-release.apk文件。

提示：如果你需要对apk进行混淆打包编辑android/app/build.gradle：。

/**      * Run Proguard to shrink the Java bytecode in release builds.   */  def enableProguardInReleaseBuilds = true

2.iOS打包

第一步：rn项目的ios工程文件夹创建bundle文件夹，然后生成jsbundle

进入rn项目的ios工程文件夹，找到和rn项目同名的文件件，打开AppDelegate.m文件，将这一行注释掉(为了方便真机和模拟器间的切换，尽量注释)：

 jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];

新加一行：

jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"index.ios" withExtension:@"jsbundle"];

如果需要切换回模拟器调试，只需要将新加这行注释掉，并恢复原代码即可。

新加这行代码意思就是告诉native rn代码的入口，我们会在下一步生成这个jsbundle。

第二步：打开终端，进入你的rn工程，在根目录下执行bundle命令

react-native bundle --entry-file ./index.ios.js --bundle-output ./ios/bundle/index.ios.jsbundle --platform ios --assets-dest ./ios/bundle --dev false

参数说明：

-entry-file 指定入口文件因为要打包ios平台，所以指定为rn项目的index.ios.js作为入口

–bundle-output 指定输出的jsbundle文件路径和文件名指定到rn项目的ios工程文件夹下，记得一定要先创建bundle文件夹，不然终端会报文件夹找不到的错误

–platform 指定平台类型

–assets-dest 指定资源文件夹路径 assets文件夹的路径，包含图片、node模块等资源

–dev 是否为开发模式如果设置为false，不会产生警告，并且bundle会被压缩
还有其他命令，比如：transformer、prepack、bundle-encoding等，可以到官网查看具体介绍。

完成后bundle生成完成后，终端会有类似提示：
React-Native 项目打包(iOS/Android)_第1张图片

第三步：用xcode Open another project打开rn项目的ios工程文件夹

配置网络访问白名单：
打开info.plist
React-Native 项目打包(iOS/Android)_第3张图片

设置应用图标和启动图:

iOS应用中没有图标，打包会报错。

然后，就可以进行打包，流程和原生iOS打包流程一样，（首先的配置证书）
iOS打包流程可以参照博客中的打包上线流程：传送门

注：Ad Hoc 和 App Store 打包过程基本一样，区别在于生成证书时需选择相对应的证书。
。

React-Native 项目打包(iOS/Android)

1. Android 打包

2.iOS打包

更多相关文章

随机推荐