React Native開發中自動打包腳本

時間  2019-11-17
標籤 react native 開發 自動 打包 腳本 欄目 React 简体版
原文   原文鏈接

React Native開發中自動打包腳本

在平常的RN開發中，咱們避免不了須要將咱們編寫的代碼編譯成安裝包，而後生成二維碼，供須要測試的人員掃描下載。可是對於非原生的開發人員來講，可能不知如何使用Xcode或者Android studio來導出ipa、apk安裝包，爲了解決非原生開發的同窗們打安裝包的痛苦，這裏做者就提供一個shell腳本文件來實現一鍵式自動打包並生成安裝二維碼 (這裏上傳安裝包生成二維碼須要藉助於三方平臺fir.im)android

打包腳本文件下載地址

github.com/guangqiang-…git

iOS

腳本執行效果

gif

使用腳本注意事項

  • 腳本配置環境變量中，is_workspace ：若是是使用pod進行管理三方庫就賦值爲true，不然是false
  • firim_token：fir_token請設置成本身的token，fir im_token如何獲取請參考fir官網fir.im/
  • scheme_name：請更換爲本身項目的scheme名稱
  • info_plist_name：請更換爲本身項目中的plist文件名稱
  • 若是沒有註冊登陸fir.im的同窗們，請先去註冊登陸fir.im，相關操做請參照fir.im官方文檔
  • 腳本文件夾放在項目的跟目錄下便可
  • 除了is_workspace firim_token scheme_name info_plist_name 這四個變量須要改成本身的，其它的地方腳本不須要修改
  • 在打包以前請確保iOS調試證書有效
  • fir.im 的token和註冊登陸流程是無關緊要的，若是以前沒有使用過fir.im的同窗們也能夠忽略fir.im相關的操做，由於fir.im只是輔助將生成的ipa安裝包文件上傳到fir, 而後生成一個能夠掃碼安裝的二維碼而已，不使用fir.im 不影響生成ipa，只是不會生成安裝二維碼

特別注意（腳本存放路徑）：

img

如何使用腳本文件

  • 將下載下來的腳本文件夾整個拖進本身的iOS工程的項目根目錄下
  • 打開終端，進入到腳本文件 autoPackageScript.sh 所在的目錄
  • 執行腳本 sh autoPackageScript.sh
  • 等待打包生成ipa和二維碼，這裏默認打包後的文件會存放在桌面

核心腳本代碼

#!/bin/sh 
# autoPackageScript.sh
# LSBuyer
#
# Created by 劉光強 on 2017/6/3.
# Copyright © 2017年 Facebook. All rights reserved.

envionmentVariables() {

    # ==================== 工程配置環境變量 ==================== #

    echo "\033[37;45m************************* step1:初始化環境變量 🚀 🚀 🚀 ************************* \033[0m"

    sleep 0.5
    # 計時
    SECONDS=0
    # 工做空間 (例:如果用Cocopods管理的.xcworkspace項目,賦值true;用Xcode默認建立的.xcodeproj,賦值false)
    is_workspace="false"
    # 指定要打包編譯的方式 : Release or Debug (默認是Release)
    build_configuration="Release"
    # fir帳戶的token, 這個token換成本身fir帳號生成的token便可
    firim_token="1b91e3f54c6e6b106be7afdd13674a43"

    # 打包腳本文件夾路徑
    script_path=$(pwd)
    # 指定項目的scheme名稱（默認爲one，須要再次賦值）
    scheme_name="one"
    # 工程中Target對應的配置plist文件名稱, Xcode默認的配置文件爲info.plist (須要再次賦值)
    info_plist_name="info"
    # 導出ipa所須要的對應的plist文件路徑 (默認爲EnterpriseExportOptionsPlist.plist)
    ExportOptionsPlistPath="$script_path/EnterpriseExportOptionsPlist.plist"

    # 返回上上級目錄,進入項目工程根目錄
    cd ..
    cd ..
    # 工程根目錄
    project_dir=$(pwd)
    # 獲取工程名稱（LSBuyer）
    project_name=`find . -name *.xcodeproj | awk -F "[/.]" '{print $(NF-1)}'`

    # Dev,Pre,Pro三種環境
    echo "\033[31;1m請選擇打包類型(輸入序號,按回車便可) \033[0m"
    echo "\033[31;1m1. 測試 \033[0m"
    echo "\033[31;1m2. 預發 \033[0m"
    echo "\033[31;1m3. 生產 \033[0m"

    # 捕獲用戶鍵盤輸入
    read packageType
    sleep 0.5
    method="$packageType"

    # 判斷用戶是否有輸入
    if [ -n "$method" ] ; then
        if [ "$method" = "1" ] ; then
            ExportOptionsPlistPath="$script_path/EnterpriseExportOptionsPlist.plist"
            # 根據用戶選擇的打包類型來設置對應的scheme和plist文件
            scheme_name="one"
            info_plist_name="info"
        elif [ "$method" = "2" ] ; then
            ExportOptionsPlistPath="$script_path/EnterpriseExportOptionsPlist.plist"
            scheme_name="LSBuyerPre"
            info_plist_name="LSBuyerPre"
        elif [ "$method" = "3" ] ; then
            ExportOptionsPlistPath="$script_path/AppStoreExportOptionsPlist.plist"
            scheme_name="LSBuyer"
            info_plist_name="Info"
        else
            echo "\033[37;45m************************* 你是否是瞎，是否是瞎 😢 😢 😢 ************************* \033[0m"
            exit 1
        fi
    fi

    # 獲取對應的plist文件
    info_plist_path="$project_dir/$project_name/$info_plist_name.plist"

    # 對應plist中的Bundle versions string, short
    bundle_short_version=`/usr/libexec/PlistBuddy -c "Print CFBundleShortVersionString" "$info_plist_path"`
    # 對應plist中的Bundle version
    bundle_version=`/usr/libexec/PlistBuddy -c "Print CFBundleVersion" "$info_plist_path"`

    # 指定輸出ipa文件夾路徑 (須要再次賦值)
    export_path=~/Desktop/$scheme_name-IPA
    # 指定輸出xcarchive路徑
    export_archive_path="$export_path/$scheme_name.xcarchive"
    # 刪除舊.xcarchive文件
    rm -rf "$export_archive_path"

    # 指定輸出ipa路徑
    export_ipa_path="$export_path"
    # 指定輸出ipa名稱 : scheme_name + bundle_short_version (須要從新賦值)
    ipa_name="$scheme_name-v$bundle_short_version"

}

Xcodebuild() {

    echo "\033[37;45m************************* step2:開始構建項目 🚀 🚀 🚀 ************************* \033[0m"
    sleep 1
    if [ -d "$export_path" ]; then
        echo $export_path
    else
        mkdir $export_path
    fi

    # 判斷編譯的項目類型是workspace仍是project
    if $is_workspace ; then
        # 編譯前作clear操做
        xcodebuild clean -workspace ${project_name}.xcworkspace \
        -scheme ${scheme_name} \
        -configuration ${build_configuration}
        # archive操做
        xcodebuild archive -workspace ${project_name}.xcworkspace \
        -scheme ${scheme_name} \
        -configuration ${build_configuration} \
        -archivePath ${export_archive_path}
    else
        xcodebuild clean -project ${project_name}.xcodeproj \
        -scheme ${scheme_name} \
        -configuration ${build_configuration}

        xcodebuild archive -project ${project_name}.xcodeproj \
        -scheme ${scheme_name} \
        -configuration ${build_configuration} \
        -archivePath ${export_archive_path}
    fi

    # 檢查是否構建成功
    # xcarchive 是一個文件夾不是一個文件因此使用 -d 判斷
    if [ -d "$export_archive_path" ] ; then
        echo "\033[37;45m項目構建成功 🚀 🚀 🚀 \033[0m"
    else
        echo "\033[37;45m項目構建失敗 😢 😢 😢 \033[0m"
        exit 1
    fi

}

ExportArchive() {
    echo "\033[37;43m************************* step3:開始導出ipa文件 🚀 🚀 🚀 ************************* \033[0m"
    sleep 0.5
    # 導出ipa
    xcodebuild  -exportArchive \
    -archivePath ${export_archive_path} \
    -exportPath ${export_ipa_path} \
    -exportOptionsPlist ${ExportOptionsPlistPath}

    # 修改ipa文件名稱
    mv $export_ipa_path/$scheme_name.ipa $export_ipa_path/$ipa_name.ipa
    # 檢查文件是否存在
    if [ -f "$export_ipa_path/$ipa_name.ipa" ] ; then
        echo "\033[37;45m導出 ${ipa_name}.ipa 包成功 🎉 🎉 🎉 \033[0m"
    else
        echo "\033[37;45m導出 ${ipa_name}.ipa 包失敗 😢 😢 😢 \033[0m"
        exit 1
    fi
    # 輸出打包總用時
    echo "\033[37;46m總用時: ${SECONDS}s \033[0m"
    open $export_path

}

previewIPAInfo() {
    echo "\033[37;43m************************* step4:預覽IPA信息 💩 💩 💩 ************************* \033[0m"
    fir info $export_ipa_path/$ipa_name.ipa

}

publishIPAToFir() {
    echo "\033[37;43m************************* step5:上傳中 🚀 🚀 🚀 ************************* \033[0m"
    echo "\033[37;43m************************* step4:預覽用戶登陸信息 💩 💩 💩 ************************* \033[0m"
    fir login "$firim_token"
    fir publish $export_ipa_path/$ipa_name.ipa -Q
    echo "\033[37;43m************************* step6:上傳完成 🚀 🚀 🚀 ************************* \033[0m"
    # 輸出總用時
    echo "\033[37;46m總用時: ${SECONDS}s 👄 👄 👄 \033[0m"
    open $export_path

}

envionmentVariables
Xcodebuild
ExportArchive
previewIPAInfo
publishIPAToFir

複製代碼

Android

執行腳本效果

gif

注意事項

  • 環境配置項中的 firim_token：換成本身的token
  • fir.im的註冊與登陸操做同iOS操做，詳細參考fir.im官方文檔 教程
  • apk默認導出路徑爲：app/build/outputs/apk
  • 打包前請確保jks簽名是否有效，若是有對生成 jks 簽名文件不熟悉的同窗，請查看做者對生成jks簽名文件的講解：www.jianshu.com/p/b28a5be05…
  • 腳本文件存放的路徑，最好放在項目根目錄下，也便是與 settings.gradle 文件同級目錄
  • fir.im 的token和註冊登陸流程是無關緊要的，若是以前沒有使用過fir.im的同窗們也能夠忽略fir.im相關的操做，由於fir.im只是輔助將生成的ipa安裝包文件上傳到fir, 而後生成一個能夠掃碼安裝的二維碼而已，不使用fir.im 不影響生成ipa，只是不會生成安裝二維碼

img

如何運行腳本

  • 將下載的腳本文件夾中的 autoPackage.sh 文件 拖到Android 項目的根目錄下
  • 打開終端，進入到 autoPackage.sh 腳本文件所在的目錄
  • 執行腳本 sh autoPackage.sh
  • 等待腳本執行，打包生成的apk文件與二維碼統一存放在 /build/outputs/apk 路徑下

核心腳本代碼

#!/bin/sh 
# autoPackage.sh
# CRM
#
# Created by 劉光強 on 2017/6/19.
# Copyright © 2017年 Facebook. All rights reserved.

# ******************** 安卓一鍵式打包並上傳到fir生成二維碼並直接掃描安裝 ********************

# 預先定義對應的環境變量
envionmentVariables(){

# 打包時間初始值
SECONDS=0
# 當前的路徑
pwd
#安卓項目工程路徑
android_project_path=$(pwd)
# 安卓apk目錄路徑
apk_dir_path="$android_project_path/app/build/outputs/apk"
# apk 路徑
apk_path="$apk_dir_path/app-dev-release.apk"
# fir帳戶的token,這個token換成本身fir帳號生成的token便可
firim_token="1b91e3f54c6e6b106be7afdd13674a43"
}

apkBuild(){

# 刪除老的apk
rm -rf $apk_path
cd "$android_project_path"
echo "\033[37;45m打包開始！！！ 🎉 🎉 🎉 \033[0m"
sleep 1
# 執行安卓打包腳本
./gradlew assembleRelease
# 檢查apk文件（app-LSW-release.apk）是否存在
if [ -f "$apk_path" ]; then
echo "$apk_path"
echo "\033[37;45m打包成功 🎉 🎉 🎉 \033[0m"
sleep 1
else
echo "\033[37;45m沒有找到對應的apk文件 😢 😢 😢 \033[0m"
exit 1
fi
}

# 預覽apk信息
previewIPAInfo(){
echo "\033[37;43m************************* step4:預覽apk信息 💩 💩 💩 ************************* \033[0m"
fir info $apk_path
sleep 1
}

# 將apk目錄下的app-LSW-release.apk 上傳到fir
publishIPAToFir(){

open $apk_dir_path
echo "\033[37;43m************************* step5:上傳中 🚀 🚀 🚀 ************************* \033[0m"
echo "\033[37;43m************************* step4:預覽用戶登陸信息 💩 💩 💩 ************************* \033[0m"
fir login "$firim_token"
fir publish $apk_path -Q
echo "\033[37;43m************************* step6:上傳完成 🚀 🚀 🚀 ************************* \033[0m"
# 輸出總用時
echo "\033[37;46m總用時: ${SECONDS}s 👄 👄 👄 \033[0m"
open $apk_dir_path
}

envionmentVariables
apkBuild
previewIPAInfo
publishIPAToFir
複製代碼

待完成

  • 將打包腳本與Jenkins結合實現動態構建

福利時間

  • 做者React Native開源項目OneM地址(按照企業開發標準搭建框架完成開發的)：github.com/guangqiang-… (歡迎小夥伴們 star)
  • 做者簡書主頁：包含60多篇RN開發相關的技術文章www.jianshu.com/u/023338566… (歡迎小夥伴們：多多關注，多多點贊)
  • 做者React Native QQ技術交流羣：620792950 歡迎小夥伴進羣交流學習
  • 友情提示：在開發中有遇到RN相關的技術問題，歡迎小夥伴加入交流羣（620792950），在羣裏提問、互相交流學習。交流羣也按期更新最新的RN學習資料給你們，謝謝支持！
相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程