1. 程式人生 > >React-Native打包釋出(Android)

React-Native打包釋出(Android)

前言:一下搞原生app一下搞rn,搞rn的時候吧想著自己原生都還這麼水,搞原生的時候吧覺得自己rn不敲就忘了,都有點力不從心了哈,不過還是加油吧~~~!!!http://blog.csdn.net/vv_bug/article/details/60581405

下面說一下React-native怎麼釋出Android apk

注意:

1、如果你是react-native整合到android專案的話,你可以先看看這篇文章,然後再往下走:

如果你是執行的:

react-native init AwesomeProject
  • 1
  • 1

命令的話,就直接往下走就可以了,因為rn都幫我配置好了一些android所需要的包跟環境了。

首先,生成app的簽名檔案,那麼什麼是簽名檔案呢?簡單來說吧,就相當於你apk檔案的一張身份證。

一:生成app的keystore檔案

1、使用keytool命令生成證書: 
-genkey

-alias tomcat(別名)

-keypass 123456(別名密碼)

-keyalg RSA(演算法)

-keysize 1024(金鑰長度)

-validity 365(有效期,天單位)

-keystore D:/keys/tomcat.keystore(指定生成證書的位置和證書名稱)

-storepass 123456(獲取keystore資訊的密碼)

例如:

 keytool -genkey
-alias demo.keystore -keyalg RSA -validity 40000 -keystore demo.keystore
  • 1
  • 1

執行完畢後會讓你設定密碼,設定完後回車:

這裡寫圖片描述

ls後可以看到目錄下多了一個test.keystore檔案。

2、通過Android Studio生成keystore檔案

這裡寫圖片描述

這裡寫圖片描述

點選create new:

這裡寫圖片描述

點選ok之後,就可以看到生成的apk檔案了。

二、找到/android/app/build.gradle這個檔案,然後添加簽名訊息:

android {
....
signingConfigs {
        releaseConfig {
            keyPassword '123123'
storeFile file('/Users/leo/Desktop/test2.jks') keyAlias 'test' storePassword '123123' } } buildTypes { release { minifyEnabled true proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro" signingConfig signingConfigs.releaseConfig } } ....
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19

三、 react-native打離線bundle包

打包命令:

Options: 
–entry-file Path to the root JS file, either absolute or relative to JS root [required]

–platform Either “iOS” or “Android”

–transformer Specify a custom transformer to be used (absolute path) [default: “/Users/babytree-mbp13/projects/xcodeProjects/AwesomeProject/node_modules/React-native/packager/transformer.js”]

–dev If false, warnings are disabled and the bundle is minified [default: true]

–prepack If true, the output bundle will use the Prepack format. [default: false]

–bridge-config File name of a a JSON export of __fbBatchedBridgeConfig. Used by Prepack. Ex. ./bridgeconfig.json

–bundle-output File name where to store the resulting bundle, ex. /tmp/groups.bundle [required]

–sourcemap-output File name where to store the sourcemap file for resulting bundle, ex. /tmp/groups.map

–assets-dest Directory name where to store assets referenced in the bundle

–verbose Enables logging [default: false]

打包步驟

  1. 在工程根目錄下執行打包命令,比如
React-native bundle --entry-file index.Android.js --bundle-output ./android/app/src/main/assets/index.android.jsbundle --platform android --assets-dest ./android/app/src/main/res/ --dev false
  • 1
  • 1

注意: 
1、[./android/app/src/main/assets/]資料夾必須存在,不存在就new一個assets資料夾,不然會報一個錯誤:

ENOENT: no such file or directory, open 'android/app/src/main/assets/index.android.bundle'
  • 1
  • 1

2、./android/app/這個路徑一定要準確

執行完畢後:

這裡寫圖片描述

三、打包apk檔案

到你rn專案的根目錄下執行:

cd android && ./gradlew assembleRelease
  • 1
  • 1

這裡寫圖片描述

好啦~ 如果沒有錯的話,就說明apk檔案打包完成了,然後到你的這個目錄下:

/android/app/build/outputs/apk
  • 1
  • 1

可以看到: 
這裡寫圖片描述

選中的檔案即為你需要釋出的apk檔案~~~

祝你好運~~~~~~~~

最後需要rn學習資料的童鞋可以聯絡我!!! 不謝哈~~~

相關推薦

React-Native打包釋出Android

前言:一下搞原生app一下搞rn,搞rn的時候吧想著自己原生都還這麼水,搞原生的時候吧覺得自己rn不敲就忘了,都有點力不從心了哈,不過還是加油吧~~~!!!http://blog.csdn.net/vv_bug/article/details/60581405 下面說一

打包釋出Android

生成簽名金鑰 `keytool -genkey -v -keystore key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000` my-release-key

react-native安卓android載入 gif 解決 辦法

看了網上很多關於這個react-native-android載入gif的文章,感覺其實不難搞,做了一個試試,沒成功,即使成功了載入時候可能出現自動退出app的情況 於是決定,休息一會......休息好了我又搞了一遍.....成了.......下面貢獻程式碼... 我是新建了一個react

react-native練手android

sdk sem 圖片 ets font 網頁 div file rom 1.環境搭建 1)一步步按 https://reactnative.cn/docs/getting-started.html 操作 2)brew install watchman 3)https://

react-native爬坑1————給現有的Android專案整合

公司專案需要頻繁更新,因此考慮使用react-native給現有的Android專案進行功能補充。研究了2天,官網的資料坑太多,網上的部落格也不適用最新的版本,跑不起來,網上翻了n多篇資料,終於能夠執行起來,開心。現在將react-native整合的詳細跳坑步驟寫一下; (1)前提:需要按照官網

react native 知識點總結

修改 ltp 組件 改變 set 覆蓋 sta 一個 個數 一、關於react native 版本的升級 參照文檔:http://reactnative.cn/docs/0.45/upgrading.html react-native -v

React Native 安卓 程序運行報錯: React Native version mismatch轉載

roi com 想要 情況下 mpi 默認 最新版 問題 face 這個問題已經得到解決,參照stackoverflow上的問題:https://stackoverflow.com/que...這個問題的原因就處在Android工程中app/build.gradle中,bu

React Native 學習筆記

坑一,環境好了,但是因為專案需求經常要安裝一些三方庫,xcode-select: error: tool ‘xcodebuild’ requires Xcode, but active developer directory ‘/Library/Develope

QT5的程式打包釋出Windows

一、平臺及工具 1.平臺 win10 Pro + QT5.7  2.QT5自帶的windeployqt(這個大家不需要下載安裝),另外一個是Engima Virtual Box,這是下載連結Engima Virtual Box 二、步驟 1.開啟一個QT程式,以r

React Native學習ListView:吸頂效果

Demo展示 ios.gif 之前兩篇文章ListView的學習都是展示了每一row的資料,而上面的效果圖中不僅展示了row資料,而且還帶有一個section header,當滑動時,這個section header會固定在頭部,也就是吸頂效果。但是遺憾的是,在A

React Native 學習筆記--init 專案 和 執行專案

宣告:此篇blog是在Windows環境下開發Android專案的學習筆記,最近也是在網上翻找資料發現,網上的資源基本上都是Mac環境下的,而且大部分的資料都是關於React Native + Web / Service 的,關於android的學習資源不多,因此也就想通過

React Native元件篇 — Touchable系列元件

Touchable元件是什麼 從字面上的意思我們就可以理解,Touchable是可觸控的控制元件,相當於我們iOS的簡單手勢。複雜的RN處理手勢還有專門的API如果你想實現檢視的拖拽,或是實現自定義的手勢,那麼請參閱PanResponder API或是手勢識別系統的文件。

React Native學習筆記Mac OS X下React Native的環境搭建

本文介紹Mac OS X系統下的React Native環境搭建過程。 1.環境要求: 1) Mac OS X作業系統 2) Xcode6.4或以上版本 3) Node.js4.0或以上版本 4) watchman和flow 2.安裝過程 1) N

React Native 入門課程2環境搭建

前提條件:蘋果電腦,Mac系統 我決定先學習關於ios開發的知識,等學會使用React Native開發出一個Ios應用程式之後,再學習關於Android的部分 所以這裡只記錄了ios的開發環境搭建。 下面有不明白的,請留言 第一步:安裝Homebrew Homebrew

React Native學習筆記Flex佈局

1、基本樣式 對於一個元件,定義元件的佈局樣式通過style屬性來定義。 例如: <Text style = {{color: '#ff0000', fontSize: 15}}> 學習佈局 </Text> 這裡通過style

React Native開發指南

    現在React Native很火所以買了本書研究研究。上學那會兒比著教科書上的demo敲程式碼,但是大部分情況都是程式碼和書上長的一模一樣,可死活就是執行不起來。工作之後買的技術書籍情況絲毫沒有改善。嗯,讀一本書如果能把書中所以的例子都跑通,其實也就消化的差不多了。

React Native技術剖析

前言 React Native(簡稱RN)的由來、優勢、安裝使用等等不在這裡囉嗦,可以自行Google/百度。筆者整理了一下之前學習RN過程中記錄的筆記,結合RN原始碼來分析RN框架裡面的一些技術思路,這對於理解和更好地使用RN都是很有益處的。由於水平有限,肯

windows下配置React-NativeAndroid開發環境總結

首先配置環境我們需要用到以下工具: node.js react-native-cli Android Studio JDK(1.8以上) SDK python 1.安裝node.js和react-native-cli命令列工具

react-native 啟動頁設定android

使用第三方外掛:react-native-splash-screen 下載地址:https://www.npmjs.com/package/react-native-splash-screen 第一步:安裝下載外掛 1、npm i react-native-splash-screen

React-Native 熱更新嘗試Android

前言:由於蘋果釋出的ios的一些rn的app存在安全問題,主要就是由於一些第三方的熱更新庫導致的,然而訊息一出就鬧得沸沸揚揚的,導致有些人直接認為“學了大半年的rn白學啦~~!!真是哭笑不得。廢話不多說了,馬上進入我們今天的主題吧。“ 因為一直在做androi