转载请标明出处:

http://blog.csdn.net/developer_jiangqq/article/details/50525976

本文出自:【江清清的博客】

(一)前言

【好消息】个人网站已经上线运行,后面博客以及技术干货等精彩文章会同步更新,请大家关注收藏:http://www.lcode.org

前几节课程我们对于React Native的一些基础配置,开发工具以及调试,Android项目移植做了相关讲解,今天一起来学习一下另外一个比较重要的知识点,就是React Native项目签名打包。

刚创建的React Native技术交流3群(496508742),React Native技术交流4群(458982758),请不要重复加群!欢迎各位大牛,React Native技术爱好者加入交流!同时博客左侧欢迎微信扫描关注订阅号,移动技术干货,精彩文章技术推送!

在我们的React NativeFor Android应用开发完成之后,那么就需要进行发布上传应用市场了,在上传之后,那么有一个很重要的步骤就是签名打包。下面我们来详细看一下怎么样进行签名打包React Native应用。具体关于Android的签名文件生成(点击进入-注意FQ)

(二)Android签名文件生成

上面有一个Android官方的签名生成方法的地址,大家可以进行详情查看,不过需要FQ哦~。我现在给大家讲解两种签名生成的方法:①:keytool命令方式生成 ,②:AndroidStudio IDE进行生成。

2.1.keytool命令生成签名秘钥

我们可以命令行运行如下命令:

  1. keytool -genkey -v -keystore my-release-key.keystore  -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

[注意].我这边环境变量已经配置了,注意上面的my-release-key这个名字可以自己取名,同时my-key-alias也是自己取名,其中第二个名称alias参数后边的别名,在后面你在为应用签名的时候需要用到,所以暂时记录一下这个别名。

上面的命令我们需要输入密钥库(keystore)密码和对应秘钥的密码,然后设置名字,组织,国家,省份相关的信息,最后会生成my-release-key.keystore的签名文件。

具体命令截图如下:

现在我们去用户默认目录下面会生成my-release-key.keystore文件。具体截图如下:

2.2.Android Studio IDE进行生成秘钥文件

个人比较倾向于这一种方法,首先是图形界面的,而且少了命令行书写的问题,而且以前我记得在使用Eclipse开发Android的时候也一直使用这种方式,下面我们来看一下生成签名的具体步骤:

首先打开AndroidStudio菜单选择build->Generate Signed APK 在打开的界面点击Next,会弹出下面的界面

然后点击create new在弹出的界面中选择填写秘钥存放的位置,名称,密码。同样还要写别名的名字,证书的所有者,国家,组织以及城市相关信息。

点击OK,会默认填写上创建好的签名的信息,

最后点击finish会生成签名秘钥,不过大家请注意看这边生成的秘钥和第一个命令行方法的秘钥的后缀不太一样的,这边是以jks结尾的,不过也没问题哦~也是同样可以签名的。

以上两种方式已经给大家演示了,打包签名的方法了,下面我们正式来进行配置打包生成APK了。

(三)Gradle配置

3.1.Gradle配置

①.首先我们要把刚刚生成的签名文件复制到项目android/app文件夹下面(这边采用AS生成签名test.jks)。

然后进行修改项目中gradle.properties文件,进行添加如下的代码(注意下面的签名和别名的名称和上一步放入的test.jks要一样,下面两项分别填写签名和别名的密码)-我取的密码为ztt12345

  1. MYAPP_RELEASE_STORE_FILE=test.jks
  2. MYAPP_RELEASE_KEY_ALIAS=test_alias
  3. MYAPP_RELEASE_STORE_PASSWORD=ztt12345
  4. MYAPP_RELEASE_KEY_PASSWORD=ztt12345

这一步我们是进行全局的gradlde进行变量化的配置,后边我们会在后边的步骤中给相应的应用进行签名。

[注意].以上的签名秘钥请大家一定要妥善保管,因为在应用发布的时候需要的。

3.2.给应用添加签名-配置局部应用Gradle文件

直接在工程目录下得android/app/build.gradle中以下节点添加如下内容:

  1. ...
  2. android {
  3. ...
  4. defaultConfig { ... }
  5. signingConfigs {
  6. release {
  7. storeFilefile(MYAPP_RELEASE_STORE_FILE)
  8. storePassword MYAPP_RELEASE_STORE_PASSWORD
  9. keyAlias MYAPP_RELEASE_KEY_ALIAS
  10. keyPasswordMYAPP_RELEASE_KEY_PASSWORD
  11. }
  12. }
  13. buildTypes {
  14. release {
  15. ...
  16. signingConfigsigningConfigs.release
  17. }
  18. }
  19. }

具体实例配置截图如下:

(四)生成签名包

对于生成签名包得方式我们要分两种情况进行区分对待。第一种在项目目录android/app下有react.gradle文件的(这个采用react-nativeinit xxproject命令生成项目详情请看:点击进入第一讲)

第二种是不存在react.gradle文件,主要是通过原生Android项目移植到React Native平台中(该生成详情详情请看:点击进入第四讲)。下面这两种方法都讲一下:

4.1.对存在react.gradle文件的项目打包

命令行切到reactnative主目录,然后运行下面的命令,请注意下面 android就是Android项目的目录名称

  1. cd android && ./gradlew assembleRelease

这样运行截图如下:

该命令运行结束之后,会在android/app/build/outputs/apk目录下面生成app-release.apk该文件,然后可以使用该apk进行上线发布。

4.2.对与不存在react.gradle文件的项目打包

这边因为react.gradle文件不存在,主要针对第四讲课程中的项目(Android原生项目移植到React Native平台)来进行举例。

首先命令切换到该reactnative项目的主目录,然后运行以下的命令,生成assets文件夹

  1. mkdir -p android/app/src/main/assets

紧接着运行以下命令,进行生成inde.android.bundle文件

  1. react-native bundle --platform android --dev false --entry-file index.android.js \
  2. --bundle-output android/app/src/main/assets/index.android.bundle \
  3. --assets-dest android/app/src/main/res/

具体运行截图如下:

生成该文件目录截图如下:

最后运行之前的命令,进行代码和资源文件打包,生成的带有签名的apk还是在上面的目录中。

  1. cd android && ./gradlew assembleRelease

(五)运行Apk

上面的步骤我们已经完成了项目的签名打包在对应的目录中生成中apk文件,下面我们直接运行以下的命令进行将apk安装到设备中,我这边直接采用了模拟器进行测试了。

  1. cd android && ./gradlew installRelease

该命令会进行安装我们的apk到我们的设备中,不过该不会安装完自动打开我们的app,我们需要自己点击启动一下即可了。完美运行截图如下:

(六)最后总结

今天我们主要介绍了React Native for Android项目如何创建签名,以及打包的具体方法。大家有问题可以加一下群React Native技术交流群(282693535)或者底下进行回复一下。

尊重原创,转载请注明:From Sky丶清(http://blog.csdn.net/developer_jiangqq) 侵权必究!

引用原文:https://blog.csdn.net/developer_jiangqq/article/details/50525976/

写博客是为了记住自己容易忘记的东西,另外也是对自己工作的总结,文章可以转载,无需版权。希望尽自己的努力,做到更好,大家一起努力进步!

如果有什么问题,欢迎大家一起探讨,代码如有问题,欢迎各位大神指正!

【React Native开发】React Native进行签名打包成Apk的更多相关文章

  1. Cocos2dx开发(3)——Cocos2dx打包成APK,ANT环境搭建

    前面cocos2dx的运行环境(Android SDK,JDK,),最后Cocos2dx的APK的打包环境,最运行环境上再加ANT环境就好了 1.ANT下载配置 官网下载:http://ant.apa ...

  2. Expo大作战(十八)--expo如何发布成独立应用程序,打包成apk或者ipa,发布到对应应用商店

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  3. 打包成apk,生成apk文件,上传到网站服务器提供链接下载

    Android开发把项目打包成apk: 做完一个Android项目之后,如何才能把项目发布到Internet上供别人使用呢?我们需要将自己的程序打包成Android安装包文件--APK(Android ...

  4. 定位真机运行能用但是打包成apk就不能用的解决方法

    打包apk的SHA1,与key的SHA1(这是多人开发的通病不同电脑共同开发一个app的常见错误之一)不一致.解决方法: 今天虽然离职了,但是今天遇到的是,当我在用高德地图开发的时候,在Android ...

  5. 初级——程序如何打包成apk文件

    将Eclipse Android项目打包成APK文件是本文要介绍的内容,主要是来了解并学习Eclipse Android打包的内容,具体关于Eclipse Android内容的详解来看本文.Eclip ...

  6. vue项目利用apicloud打包成apk过程

    最近公司要求我们用apicloud做一个app,正好利用这个机会学习下app的制作过程~ 页面的开发过程跟我们平时开发一样,利用vue把页面全部完成,最后进行npm run build将项目打包. 接 ...

  7. 使用cordova把h5应用打包成apk

    由于h5应用开发不是本例重点,因此直接提供一个最简单的h5应用代码,此应用使用vue-cli框架开发 此h5应用叫vue1,用webstrom打开vue1,进行npm install安装引用 vue1 ...

  8. VUE+Ionic,项目搭建&打包成APK

    安装Vue&创建Vue工程 1.安装Vue CLI: npm install -g vue-cli 2.创建新的Vue项目,创建最后一步会提醒是否使用npm install 自动安装,如果选择 ...

  9. Android项目打包成APK文件

    第一步:右键单击该项目选择Export项目 显演示样例如以下界面:选择Exprot Android Application 第二步:输入项目名称,默认的情况下是原始的项目名称 下一步: 点击 Crea ...

随机推荐

  1. WPF DataGrid 获取选中的当前行某列值

    方法一: DataRowView mySelectedElement = (DataRowView)dataGrid1.SelectedItem; ]ToString(); 方法二: var a = ...

  2. beetl模板的${!}用法

    转自:http://ibeetl.com/guide/#beetl 2.20. 安全输出 安全输出是任何一个模板引擎必须重视的问题,否则,将极大困扰模板开发者.Beetl中,如果要输出的模板变量为nu ...

  3. angualar入门学习-- 自定义指令 指令编译执行过程

    3个阶段: 一.加载阶段 加载angular.js的源码,找到ng-app确定应用边界范围. 二.编译阶段 compile 查找所有指令,保存在一个列表中 对所有指令按优先级(property属性值) ...

  4. 纯java实现邮件发送服务(亲测好用)

    今天自己测试了一下用java代码实现发送有限的服务,非常简单.直接贴代码: import com.sun.mail.util.MailSSLSocketFactory; import javax.ma ...

  5. 常用的mysql语句

    为了方便学习mysql,把接触到的sql收集一下,忘记的时候可以查询一下. 连接mysql数据库: mysql -u 用户名 -p 输入密码. 创建数据库: create database 数据库名; ...

  6. libprotobuf 编译错误处理

    1. 编译完链接的时候报错undefined reference to well_known_types_js' 出现这个错误的原因是升级gcc导致的,是程序依赖的include文件和实际链接的文件不 ...

  7. Design Pattern – Proxy, Adapter, Facade, Mediator

    这几个模式比较类似, 都是用作interface, 但有所不同 Proxy, 特点是以假乱真, client在使用的时候就和在使用真正的object一样, 接口完全一致, proxy和object的交 ...

  8. js基础练习--控制多组图片切换

    js基础练习题,一个按钮控制两组图片的切换,做这题的时候我忽然想到了将num1.mun2……都存放在一个数组中,根据索引值匹配到对应相应组的图片,这样不管有多少组图片都简单的搞定切换,可惜js基础都没 ...

  9. PYTHON 最佳实践指南(转)

    add by zhj: 本文参考了The Hitchhiker's Guide to Python,当然也加入了作者的一些东西.The Hitchhiker's Guide to Python 的gi ...

  10. win64系统丢失d3dx9d_40.dll问题

    在Win64系统中,安装了DXSDK.DX9,却一直显示如上对话框,导致程序运行不起来. 于是我在网上找到了一个d3dx9d_40.dll,覆盖到C:\Windows\System32中,但是问题依然 ...