React-Native開發調試和打包記錄

公衆號：暮北林
Q Q 羣 : 一塊兒學前端
今天的記錄一下在工做中使用RN調試時遇到的一些問題(針對Android)

話很少說直接寫調試易錯點

個人開發環境

// 系統 Ubuntu 19.04
// RN版本 React-native 0.61
// 開發工具 Vscode
複製代碼

1. SDK配置成功,可是create的初始項目如何都運行不起來

// 在android目錄下新增一個名爲.local.properties的文件
// 具體內容爲你本機的SDK位置 有時候是沒法找到你的sdk位置
// 例如：
sdk.dir=/home/wangfpp/Android/sdk
複製代碼

2. 真機或者模擬器鏈接不了本地server沒法調試

1. 模擬器是否開啓/真機是否已經鏈接
// 在終端輸入 adb devices 查看已經鏈接的設備
// 若是設備存在那就查看另外一個緣由

2. 查看機器是否配置調試端口
// 模擬器直接Ctrl + M 真機搖晃手機 或者adb shell input keyevent 82調出Devtools
// Dev Settings -> Debug server host for device選擇倒數第二項的設置
// 輸入開發機的IP:8081
// 從新reload

3. 若是依然沒法調試
// 查看手機和開發機器是否在同一網段內

4. 可能還須要重置調試端口
adb reverse tcp:8081 tcp:8081
複製代碼

以上是調試中我遇到的問題 能調試就能發現問題所在,在去想辦法解決問題

如何自定義打包

./gradlew assembleRelease 
// 這條命令在Linux下執行以前須要修改chmod
sudo chmod +x ./gradlew  
// 賦予x可執行權限
複製代碼

React-native打包出的apk名爲app-release.apk/可是真實的上線APK的名字通常爲${ProjectName}_${VERSION}-${DATE}.apk

如何生成/讀取這三個(項目名 版本號 打包日期)變量的值呢?

如何讀取版本號

1. 版本號的位置
// 其實版本號就在package.json中
// 在js/jsx中咱們能夠直接
import packageJson form 'path/package.json'
const { version } = packageJson
// 可是在打包腳本中是沒法import這個文件的 可是咱們能夠找到這個文件
複製代碼

打包腳本的位置在android/app/build.gradle

## 大概在129行的位置
android{
   ....
   defaultConfig {
    applicationId "com.record"
    minSdkVersion rootProject.ext.minSdkVersion
    targetSdkVersion rootProject.ext.targetSdkVersion
    versionCode 1
    versionName appVersion //這裏修改版本號
   }
   ....
}
### 讀取package.json的版本號
### 定義一個讀取版本號的函數
def getAppVersion() {
    ## File packageJsonFile這個須要在文件頭部引用
    ## 在文件頭部引用此包 import groovy.json.JsonSlurper

    File packageJsonFile = new File('../package.json') 

    ## 實例化jsonslurper
    def jsonslurper = new JsonSlurper()

    ## 解析文件內容
    def packageJson = jsonslurper.parseText(packageJsonFile.text)

    ## 讀取version字段並return
    return packageJson["version"]
}
## 定義一個變量接收函數返回值
def appVersion = getAppVersion()
複製代碼

如何增長打包時間修改打包文件名稱

## 仍是android/app/build.gradle 打包184行左右
### 若是是release打包上線包APK則修改apk名稱
if (buildName == 'release') {
   ## 獲取當前打包的時間
   def createTime = new Date().format("YYYY-MM-dd", TimeZone.getTimeZone("GMT+08:00"))
   
   ## 從新命名APK名稱
   def outputFileName = "M2600-${variant.versionName}_${createTime}.apk"
   // println output.getPackageApplicationProvider()
   
   ## 打包輸出爲新的APK名稱
   output.outputFileName = outputFileName
}
複製代碼

從新打包

1. 以上修改完成後從新執行./gradlew assembleRelease 
打包後的APK名稱爲 M2600-0.0.1_2020-03-07.apk
2. apk的位置在
android/app/build/output/apk/release/...
複製代碼

書寫打包腳本

1. 打包命令./gradlew assembleRelease 太長記不住
2. 新建release.sh
3. sudo chmod +x ./release.sh
4. 書寫打包腳本
複製代碼

在android目錄下創建release.sh文件

#!/bin/bash
### Android打包腳本

APP_HOME="`pwd -P`"
./gradlew assembleRelease
if [ $? != 0 ]; then
    echo '打包失敗'
    exit 1
else:
 ## build success do somthing
 ## 移動APK到其餘地方 cp M2600-0.0.1_2020-03-07.apk /home/apk/
 ## 或者作一些其餘事情
fi
複製代碼

此次只是本身工做的記錄

個人公衆號和QQ羣

公衆號

QQ羣