React-Native中iOS一键打包发布脚本

由于之前项目忙，加上第一次写的时候还是Xcode7. 因此一些xcodebuild的命令参数已经发生变化了。私下看到很多同学询问解决问题，在此说声抱歉，并更新了一下plist导出文件。

RN项目中的iOS打包jsbundle，ipa包，发布测试不得不说是一件非常让人头疼的问题。🤔
每次写好js代码以后，需要打包发布测试的时候都需要做一大堆工作。😒

这里我们先分析一下哪些问题是我们必须要做的和想要获取的功能

1.首先真机运行时，RN项目需要一个jsbunlde包和assets包来获取所有的js代码和资源文件。
2.我们需要生成并记录每个不同版本生成的jsbunlde包。尤其对于需要测试增量更新，或者普通热更新的项目。
3.记录每次打包生成的一些配置参数和必要数据也是我们需要的。
4.自动打包adhoc的ipa包用于测试。
5.自动上传到fir.im发布ipa包，并添加本次修改的信息。
6.生成一个jsbunlde的需求,用于热更新或者增量更新的使用。
7.自动记录每次打包更新的一些新功能描述。

分析了我们需求后,那接下来就用shell脚本来帮助我们一同来构建整个自动化的过程。
这里，我们演示使用AdHoc方式打包测试。
假设当前项目中的p12,adhoc配置文件已经安装的情况下，如果有不知道p12,adhoc配置文件是什么的新同学，建议还是先去百度一下吧👀。

下面是shell在项目中的使用,创建一个.sh文件来编写脚本

有同学反映了一些使用中的问题。这里说明一下，下面的这个脚本仅支持cocoapods方式的ios工程的打包,上传的测试平台是fir.im


#!/bin/sh

#请配置如下打包信息

#项目中文昵称
projectChineseName=XXXX
#项目工程名字
projectName=XXXX
#fir.im的Token
firToken=XXXX
#编译条件 Realse Debug 两种
configuration=Realse

echo "请输入此版本更新的内容描述:\n"

read answer

bundle=./ios/bundle

if [ -d "${bundle}" ]; then
rm -rf ${bundle}
fi

mkdir ${bundle}

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

cd ios
#记录一下当前jsbundle路径
jsbundlePath=`pwd`

xcodebuild clean -workspace ${projectName}.xcworkspace -scheme ${projectName} -configuration ${configuration}

xcodebuild archive -workspace ${projectName}.xcworkspace -scheme ${projectName}  -configuration ${configuration}  -archivePath ../${projectName}.xcarchive

#创建文件夹
exportPathDir=~/Documents/${projectChineseName}ipa包历史记录

if [ ! -d "${exportPathDir}" ]; then
  mkdir ${exportPathDir}
fi

#根据时间创建对应的文件目录
exportPath=${exportPathDir}/${projectName}-$(date "+%Y-%m-%d日%H:%M:%S")

if [ ! -d "${exportPath}" ]; then
  mkdir ${exportPath}
fi

xcodebuild -exportArchive -archivePath ../${projectName}.xcarchive -exportOptionsPlist ../AdHocOptions.plist -exportPath "${exportPath}"

cd ${exportPath}

#登录fir.im
fir login -T ${firToken}

#发布到fir.im
fir publish ${projectName}.ipa -Q --changelog="本次修改描述:  $answer "

#压缩拷贝jsbundle到文件目录中去
cd ${jsbundlePath}
zipFile=${projectName}_iOS_jsbundle.zip
zip -r ${zipFile} bundle
mv ${zipFile} ${exportPath}

#保留xcarchive文件
cd ${jsbundlePath}
cd ..
mv ./${projectName}.xcarchive ${exportPath}
cd ${exportPath}
fir info ${projectName}.ipa > logfile.txt

echo  "本版本更新描述:  $answer " >> logfile.txt
echo "     🤡自动打包并上传fir.im成功~~~🤡"
open .

可能你有些夢😰 没关系。我们一起来回想一下我们的需求,在一起结合我们的脚本看看它到底做了些什么😀
首先:我们需要将脚本放置于RN工程首目录下,与iOS工程同级目录
1:每个项目都需要一些基本设置,例如项目的名字,其实大部分情况下也是xcode编译时候的scheme选项,其次是编译的条件,例如debug或者是release。同时我们可能需要做所有历史打包信息的自动记录,那么一定少不了一个文件夹目录,鉴于方便易懂,这里就添加了一个中文名文件夹的参数选项，英文不好的同学有没有觉得很人性化呢🤓

#项目中文昵称
projectChineseName=XXX
#项目工程名字
projectName=XXXX
#fir.im的Token
firToken=XXXX
#编译条件 Realse Debug 两种
configuration=Realse

不同的应用,仅仅需要修改这里的配置信息即可

2:首先我们可能需要脚本执行以后,提示我,当前次的更新需要添加一些描述信息,用于记录本次更新的内容,方便未来的查看以及上传fir.im的时候自动添加到更新描述上面去

echo "请输入此版本更新的内容描述:\n"

read answer

就是用于记录我们的描述信息
3:我们需要生成jsbundle,而且这个文件生成后,要自动放入到ios工程目录下,这样打包ipa的时候,才能自动嵌入ipa包中,这里提醒一下,一定要将之前项目中的旧包删除掉

bundle=./ios/bundle

if [ -d "${bundle}" ]; then
rm -rf ${bundle}
fi
mkdir ${bundle}

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

4:接下来我们就需要用到之前有讲过的xcodebuild命令去先clean一下工程,clean工程是因为每次xcode在调试的时候,都会自动在当前目录生成一些编译后的一些文件,日志等,这些对我们打包是无用的。

这里面主要展示使用pod的项目，指明了pod的workspace。如果项目中未使用pod,修改为-workspace ${projectName}.xcworkspace 为-project$ {projectName}.xcodeproj

xcodebuild clean -workspace ${projectName}.xcworkspace -scheme ${projectName} -configuration ${configuration}

5:开始存放我们的工程,并生成存档文件,而且,这里的存档文件我们非常有必要记录下来,上线项目中产生的crashlog,可以通过该文件,分析出crash的具体代码,那这里一定要记录好当前生成.xcarchive文件的路径,等后面编译结束后,我们再整合起来

xcodebuild archive -workspace ${projectName}.xcworkspace -scheme ${projectName}  -configuration ${configuration}  -archivePath ../${projectName}.xcarchive

6:想要强大的历史包记录,一定少不了一个文件夹去记录,这里我选择在Documents而不是Desktop想必你懂的,至少我的桌面是不堪入目的,Documents目录下还是一片净土

#创建文件夹
exportPathDir=~/Documents/${projectChineseName}ipa包历史记录

if [ ! -d "${exportPathDir}" ]; then
  mkdir ${exportPathDir}
fi

7:想要做到每次打包生成的记录都不重合,那么就根据当前打包的时间来创建新的一层文件结构吧

#根据时间创建对应的文件目录
exportPath=${exportPathDir}/${projectName}-$(date "+%Y-%m-%d日%H:%M:%S")

if [ ! -d "${exportPath}" ]; then
  mkdir ${exportPath}
fi

8:文件历史目录结构都有了,接下来,开始打包ipa了,并存入该文件目录中去
欣喜的同学一定发现了AdHocOptions.plist文件是个什么👻。
这里还是贴出来一下吧，请赞我是大好人，其实就是打包的配置信息。
点击赞我下载plist文件，下载后，防止与RN工程根目录，与shell脚本同级。
如果想要有更多的需求，终端输入xcodebuild -h 命令。
自己查看Available keys for -exportOptionsPlist详情哦😜

plist.jpg

xcodebuild -exportArchive -archivePath ../${projectName}.xcarchive -exportOptionsPlist ../AdHocOptions.plist -exportPath "${exportPath}"

9:ipa都打好了,不用多少,我们要赶紧登陆fir.im网站,并自动上传到fir,同时,生成一个二维码下载图片.具体的fir-cli,查看传送门吧

cd ${exportPath}

#登录fir.im
fir login -T ${firToken}

#发布到fir.im
fir publish ${projectName}.ipa -Q --changelog="本次修改描述:  $answer "

10:说要的要记录每次jsbunle千万不能忘

#压缩拷贝jsbundle到文件目录中去
cd ${jsbundlePath}
zipFile=${projectName}_iOS_jsbundle.zip
zip -r ${zipFile} bundle
mv ${zipFile} ${exportPath}

11:说好的记录.xcarchive文件也千万不能忘

cd ${jsbundlePath}
cd ..
mv ./${projectName}.xcarchive ${exportPath}

12:仅仅记录这么点信息哪里够呢,每次打包的信息我们最好也记录一下,方便后面的查看

cd ${exportPath}

fir info ${projectName}.ipa > logfile.txt

echo  "本版本更新描述:  $answer " >> logfile.txt

至此,一个自动打包jsbundle,自动生成ipa,上传fir.im,记录所有打包信息的文件目录结构就完成了,给shell脚本起一个响亮的名字吧
OneKeyPackageForIOS如何,ios一键打包脚本

看一下要如何使用这个脚本

image

打包后生成的文件目录

image

logfile.txt文件记录的信息

image

fir.im的信息

image

到此,本以为我们的一键打包的脚本就完成了。其实在其他项目,仅仅替换掉最开始项目参数的可以随意使用哦~但鉴于其他同学的工程可能没有使用cocoapods来管理原声的ios的代码，获取开发人员根本就不懂ios，压根就没有使用过cocoapods等等一些情况，也有同学说，可不可以上传到蒲公英网站呢?

答案是：YES

来吧，好人做到底。下面是修改了以后的脚本代码，支持打包adhoc版本的ipa包，上传到蒲公英网站，并且声称更新描述，以及jsbundle等。

#!/bin/sh

#请配置如下打包信息

#项目中文昵称
projectChineseName=XXXX
#项目工程名字
projectName=XXXX
#蒲公英配置的参数
APIKey=""
UserKey=""
#编译条件 Realse Debug 两种
configuration=Realse

echo "请输入此版本更新的内容描述:\n"

read answer

bundle=./ios/bundle

if [ -d "${bundle}" ]; then
rm -rf ${bundle}
fi

mkdir ${bundle}

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

cd ios
#记录一下当前jsbundle路径
jsbundlePath=`pwd`

xcodebuild archive -project ${projectName}.xcodeproj -scheme ${projectName}  -configuration ${configuration}  -archivePath ../${projectName}.xcarchive

#创建文件夹
exportPathDir=~/Documents/${projectChineseName}ipa包历史记录

if [ ! -d "${exportPathDir}" ]; then
  mkdir ${exportPathDir}
fi

#根据时间创建对应的文件目录
exportPath=${exportPathDir}/${projectName}-$(date "+%Y-%m-%d日%H:%M:%S")

if [ ! -d "${exportPath}" ]; then
  mkdir ${exportPath}
fi

xcodebuild -exportArchive -archivePath ../${projectName}.xcarchive -exportOptionsPlist ../AdHocOptions.plist -exportPath "${exportPath}"

cd ${exportPath}

#压缩拷贝jsbundle到文件目录中去
cd ${jsbundlePath}
zipFile=${projectName}_iOS_jsbundle.zip
zip -r ${zipFile} bundle
mv ${zipFile} ${exportPath}

#保留xcarchive文件
cd ${jsbundlePath}
cd ..
mv ./${projectName}.xcarchive ${exportPath}

cd ${exportPath}

#上传至蒲公英
curl -i -F "file=@malugongyuanList.ipa" \
-F "uKey=$UserKey" \
-F "_api_key=$APIKey" \
-F "updateDescription=$answer" \
http://qiniu-storage.pgyer.com/apiv1/app/upload \

echo  "本版本更新描述:  $answer " >> logfile.txt
echo "      🤡自动打包并上传fir.im成功~~~🤡"

open .

~至此，结束！
有任何问题，欢迎随时call me🤓

最后编辑于：2019.01.27 21:23:04

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 206,214评论 6赞 481
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 88,307评论 2赞 382
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 152,543评论 0赞 341
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 55,221评论 1赞 279
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 64,224评论 5赞 371
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 49,007评论 1赞 284
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 38,313评论 3赞 399
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 36,956评论 0赞 259
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 43,441评论 1赞 300
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 35,925评论 2赞 323
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 38,018评论 1赞 333
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 33,685评论 4赞 322
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 39,234评论 3赞 307
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 30,240评论 0赞 19
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 31,464评论 1赞 261
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 45,467评论 2赞 352
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 42,762评论 2赞 345

React-Native中iOS一键打包发布脚本

由于之前项目忙，加上第一次写的时候还是Xcode7. 因此一些xcodebuild的命令参数已经发生变化了。私下看到很多同学询问解决问题，在此说声抱歉，并更新了一下plist导出文件。

下面是shell在项目中的使用,创建一个.sh文件来编写脚本

有同学反映了一些使用中的问题。这里说明一下，下面的这个脚本仅支持cocoapods方式的ios工程的打包,上传的测试平台是fir.im

看一下要如何使用这个脚本

打包后生成的文件目录

logfile.txt文件记录的信息

fir.im的信息

推荐阅读更多精彩内容