在 Flutter 混合工程体系 一文中，阐述了Flutter 三种开发模式，在实际业务中搭建持续集成时，我们更希望本地开发使用混合模式，持续集成使用解耦模式， 主要是解决以下两个问题：

  1. 混合模式：开发调试方便，包括热更新， Native 与 Flutter 开发源码断点调试
  2. 解耦模式：不侵入 iOS Native工程，不对 Flutter 环境产生依赖，可以单独独立构建打包

我们这里重点阐述 解耦模式，要对 iOS 与 Flutter 进行解藕，就需要分析混合模式最终生成的 iPA文件内容长啥样和 Flutter 构建脚本。

iOS Flutter 项目 IPA 文件结构分析

ipa 文件 改成 zip 文件，然后解压，进入 Payload 文件夹，会看到一个 .app 的文件，右键显示包内容，即可看到类型如下内容(该测试项目是用 swfit + flutter )。
经过分析，与普通的iOS 项目相比，就多了个 Flutter.framework 文件。经过查阅资料，

image.png

构建 iOS Flutter Framework 和 插件

  • flutter build ios 编译 App.framework, 模拟器需要使用 —simulator —no-codesign 标识
  • 复制 App.framework 和 Flutter.framework 到临时目录
  • 复制 Flutter 生成的 iOS 桥接 FlutterPluginRegistrant 插件到临时目录
  • 处理 Flutter 项目的依赖插件，复制 .a 文件和 .h 头文件到临时目录

util.zip

  1. #!/bin/bash
  2. root=`pwd`
  4. . "${root}/script/util.sh"
  6. target_dir=../HappyIOS/Flutter
  7. flutter_engine_dir=ios
  8. build_app_dir=${root}/build/ios/iphonesimulator
  9. build_lib_dir=${root}/build/ios/Debug-iphonesimulator
  10. build_cmd="flutter build ios --simulator --no-codesign --debug"
  12. if [[ $build = "release" ]]
  13. then
  14.   flutter_engine_dir=ios-release
  15.   build_app_dir=${root}/build/ios/iphoneos
  16.   build_lib_dir=${root}/build/ios/release-iphoneos
  17.   build_cmd="flutter build ios --release"
  18. fi
  19. green "--flutter module build start--"
  20. yellow ">>${build_cmd}"
  22. flutter clean
  23. # flutter build ios --simulator --no-codesign --${build}
  25. ${build_cmd}
  27. green "--flutter module build end--"
  29. # copy Flutter.framework and App.framework
  31. green "--flutter build file copy start--"
  33. rm -rf ${target_dir}/**
  35. # copy flutter engine framework
  36. cp -r ${flutter_root}/bin/cache/artifacts/engine/${flutter_engine_dir}/Flutter.framework  ${target_dir}
  37. # cp -rf ${build_app_dir}/Runner.app/Frameworks/Flutter.framework  ${target_dir}
  38. cp -rf ${build_app_dir}/Runner.app/Frameworks/App.framework  ${target_dir}
  39. cp -rf ${build_lib_dir}/FMDB "${target_dir}/FMDB"
  40. cp -rf ${build_lib_dir}/FlutterPluginRegistrant "${target_dir}/FlutterPluginRegistrant"
  41. cp -rf ${root}/.ios/Flutter/FlutterPluginRegistrant/Classes/GeneratedPluginRegistrant.h  "${target_dir}/FlutterPluginRegistrant/"
  43. for line in $(cat .flutter-plugins)
  44. do
  45.     arr=(${line/=/ })
  46.     name=${arr[0]}
  47.     path=${arr[1]}
  48.     plugin_name=`basename $path`
  49.     plugin_dir=$(dirname $path)
  50.     plugin=${path}android
  52.     a_header="${path}ios/Classes/*.h"
  54.     a_file="${build_lib_dir}/${name}"
  56.     if [ ! -f $arr ]
  57.     then
  58.        cp -rf ${a_file} ${target_dir}
  59.        cp -rf ${a_header} ${target_dir}/${name}
  60.     else
  61.        echo "$aar is not exists"
  62.     fi
  63. done
  66. green "--flutter build file copy end--"

iOS Native 本地引用构建产物文件

通过 Xcode 为 iOS Native 项目添加 Flutter 构建产物依赖. Xcode 点击项目名，找到 Build Phases Tab：

  • 在Link Binary Width Libraries 添加所有构建产物的依赖
  • 点击左上角加个添加一个 New Copy Files Phases 选项，然后添加 Flutter.framework 和 App.framework ，

image.png

iOS Native 通过 Pod 引用构建产物文件

根据Flutter构建的产物构建编写 Pod 插件，然后 让 iOS Native 工程通过 Pod 方式依赖