最近在集成flutter進項目
以收集編譯產物并以cocopods方式集成
產物大概放入兩個pod庫
這個暫且叫pod1,pod1放flutter.framework,第三方plugin.a,自己寫的基礎plugin,比如networking,hud等等(由于是混編,不可避免存在很多原生基礎組件,所以能公用的基礎組件都會弄一個flutter-plugin橋接)
image.png
第二個pod2放編譯之后的app.framwork,注冊文件GeneratedPluginRegistrant,以及各個業務模塊.a(有可能沒有)結構大概如下面
image.png
podspec大概如下
s.source_files = 'GDFlutter/Classes/**/*' , 'flutter_module/product/libFlutterPluginRegistrant/*.{h,m}' , 'flutter_module/product/libGDFlutterBusiness*/*.{h,m}'
arr = Array.new
arr.push('flutter_module/product/**/App.framework')
s.ios.vendored_frameworks = arr
arr1 = Array.new
arr1.push('flutter_module/product/libGDFlutterBusiness*/*.a')
s.ios.vendored_libraries = arr1
主工程引入這兩個pod庫即可
接下來從零開始搭建上文所說的
flutter create flutter_module
先創建一個flutter module
這個是主flutter工程,用來集成businessModule以及生成app.framework
結構如下圖
image.png
再生成一個業務工程
flutter create --template=plugin GDFlutterBusinessAboutGD
注意 我規定業務模塊必須以GDFlutterBusiness開頭 不然上文提到的pod2無法收集產物
image.png
注意此時還需要進入example生成ios和Android工程,不然無法單獨編譯運行
cd example
flutter create .
image.png
這樣 這個單獨的業務模塊就可以單獨跑起來了
此時主flutter工程和業務工程均搭建完畢
在主工程pubspec.ymal文件講兩個工程關聯
image.png
好了 接下來就是編寫腳本收集產物了
if [ ! -d "./product" ];then
mkdir ./product
else
echo -e " 文件夾已經存在 "
rm -rf ./product/*
fi
config='Debug'
appConfig="$(echo $config | tr '[:upper:]' '[:lower:]')"
#
#echo -e " ===清理Flutter歷史編譯=== "
##flutter clean
#
echo -e " ===重新生成plugin索引=== "
flutter packages get
#
# 刪除原生成的App.framework
rm -rf ./ios/Flutter/App.framework
echo -e " ===生成App.framework=== "
echo -e " flutter build ios --${appConfig} "
flutter build ios --${appConfig}
# 創建放置產物的目錄
if [ ! -d "./product/app" ];then
mkdir ./product/app
fi
# 收集App.framework,生成podspec
cp -fr ./.ios/Flutter/App.framework ./product/app
cp -f $FLUTTER_ROOT/App.podspec ./product/app
#
## 收集Flutter.framework與podspec
echo -e " ===拷貝Flutter.framework=== "
cp -fr ${FLUTTER_ROOT}/bin/cache/artifacts/engine/ios/Flutter.framework ./product/engine
cp -f ${FLUTTER_ROOT}/bin/cache/artifacts/engine/ios/Flutter.podspec ./product/engine
if [[ ! -d "./product/libFlutterPluginRegistrant" ]]; then
mkdir "./product/libFlutterPluginRegistrant"
fi
cp -rf ./ios/Runner/GeneratedPluginRegistrant.h "./product/libFlutterPluginRegistrant/"
cp -rf ./ios/Runner/GeneratedPluginRegistrant.m "./product/libFlutterPluginRegistrant/"
if [[ "$config" =~ "Release" ]];then
lipo -remove "x86_64" "./product/app/App.framework" -output "./product/app/App.framework"
lipo -remove "x86_64" "./product/engine/Flutter.framework" -output "./product/engine/Flutter.framework"
fi
echo -e " ===生成plugin的靜態庫=== "
while read -r line
do
if [[ ! "$line" =~ ^// ]]; then
array=(${line//=/ })
plugin_name=${array[0]}
echo -e " ===修正注冊文件=== "
perl -pi -e "s|\<${plugin_name}\/|\"|g" ../../product/libFlutterPluginRegistrant/GeneratedPluginRegistrant.m
perl -pi -e "s|.h\>|.h\"|g" ../../product/libFlutterPluginRegistrant/GeneratedPluginRegistrant.m
cd ios/Pods
/usr/bin/env xcrun xcodebuild build -configuration ${config} ARCHS='arm64 armv7' -target ${plugin_name} BUILD_DIR=../../build/ios -sdk iphoneos -quiet
/usr/bin/env xcrun xcodebuild build -configuration ${config} ARCHS='x86_64' -target ${plugin_name} BUILD_DIR=../../build/ios -sdk iphonesimulator -quiet
echo -e " 合并lib${plugin_name}.a... "
if [[ ! -d "../../product/lib${plugin_name}" ]]; then
mkdir "../../product/lib${plugin_name}"
fi
lipo -create "../../build/ios/${config}-iphonesimulator/${plugin_name}/lib${plugin_name}.a" "../../build/ios/${config}-iphoneos/${plugin_name}/lib${plugin_name}.a" -o "../../product/lib${plugin_name}/lib${plugin_name}.a"
if [[ "$config" =~ "Release" ]];then
lipo -remove "x86_64" "../../product/lib${plugin_name}/lib${plugin_name}.a" -output "../../product/lib${plugin_name}/lib${plugin_name}.a"
fi
echo -e " 復制頭文件 "
classes=${array[1]}ios/Classes
for header in `find "$classes" -name *.h`; do
cp -f $header "../../product/lib${plugin_name}/"
done
echo -e " 復制podspec文件 "
specDir=${array[1]}ios
for spec in `find "$specDir" -name *.podspec`; do
cp -f $spec "../../product/lib${plugin_name}/"
done
else
echo -e " 讀取文件出錯 "
fi
done < .flutter-plugins
echo -e " 編譯完成???????????????????????????????? "
編譯完成之后會在flutter主工程product生成如下文件
image.png
將上面文件分類收集做成文章開頭的pod1,pod2 ,在native工程引入即可
image.png
在集成flutter的過程中 踩不少坑 也閱讀很多前輩的文章,在此一并感謝