IOS Flutter混编工程的CI接入--实践篇

上一篇文章讲到混合工程解耦的原理,今天讲一下具体实践。

1.上传flutter产物到git

我们需要在Flutter工程编译完以后获取相关的产物然后上传到git上。
上一节我们知道,flutter是通过podfile文件在iOS的编译过程中插入了一段flutter编译流程。那我们就在这个流程之后,紧接着添加一个上传到git的流程就可以了。
我们修改iOS工程的podfile文件,添加上传流程

target 'MyApp' do
  install_all_flutter_pods(flutter_application_path)
  upload_production(flutter_application_path)       //添加上传流程
end

在iOS工程的根目录添加文件podhelper.rb添加上传流程,

def upload_production(flutter_application_path)
    current_pathname = Pathname.new flutter_application_path
    project_pathname = Pathname.new Dir.pwd
    script_phase :name => 'Upload Flutter Production Script',
    :script => "set -e\nset -u\n\"${SRCROOT}\"/#{current_pathname}/xcode_backend.sh build",
    :execution_position => :before_compile
end

这段代码就是实现的在build phase中添加Upload Flutter Production Scrip这一过程,而这个过程中其实就是运行Flutter工程根目录下的xcode_backend.sh脚本文件实现的。

我们接下来添加xcode_backend.sh文件,这个文件实现的就是获取编译后的Flutter的各种产物,然后上传到github中,其中git的地址是[email protected]:haohongwei/xxx.git。同时需要注意的是因为要通过命令行提交产物,因此必须开通Git 服务器的 SSH 公钥认证。否则会导致没有上传权限的问题。

BUILD_MODE=${CONFIGURATION}
# 根文件
ROOT_PATH="$(dirname $0)"
# 编译目录
BUILD_PATH="${ROOT_PATH}/build_ios/${BUILD_MODE}"
# 存放产物的目录
PRODUCT_PATH="${BUILD_PATH}/BUILD_MODE"

# 存放产物的Git地址
PRODUCT_GIT_URL="[email protected]:haohongwei/xxx.git"

# podSpec的名称
Flutter_APPFRAMEWORK_PODSPEC_NAME="flutter_xxx_xxx.podspec"

temp=${PRODUCT_GIT_URL##*/}

# Git的目录
PRODUCT_GIT_DIR="${ROOT_PATH}/.ios/${temp%.*}"
# Git存放产物的目录
PRODUCT_GIT_BUILD_DIR="${PRODUCT_GIT_DIR}/${BUILD_MODE}"

echo "PRODUCT_GIT_DIR  ${PRODUCT_GIT_DIR}"

current_path="$PWD"
echo "current_path  ${current_path}"


flutter_copy_packages() {
    echo "================================="
    echo "Start copy flutter app plugin"
    MYDIR=`dirname $0`

    local flutter_appframework="App.framework"
    local flutter_appframework_podspec="${Flutter_APPFRAMEWORK_PODSPEC_NAME}"
    local flutter_appframework_plist="AppFrameworkInfo.plist"
    local flutter_appframework_path="${MYDIR}/.ios/Flutter/"

    local flutter_flutterframework_path="${MYDIR}/.ios/Flutter/engine/"
    local flutter_flutterframework="engine"
    
    local flutter_plugin_registrant="FlutterPluginRegistrant"
    local flutter_plugin_registrant_path="${MYDIR}/.ios/Flutter/${flutter_plugin_registrant}"
    echo "copy 'flutter_plugin_registrant' from '${flutter_plugin_registrant_path}' to '${PRODUCT_PATH}/${flutter_plugin_registrant}'"

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

    git clone "$PRODUCT_GIT_URL" "$PRODUCT_GIT_DIR"

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

    mkdir -p "$PRODUCT_GIT_BUILD_DIR"

    cp -rf -- "${flutter_appframework_path}${flutter_appframework}" "${PRODUCT_GIT_BUILD_DIR}"
    cp -rf -- "${flutter_appframework_path}${flutter_appframework_podspec}" "${PRODUCT_GIT_BUILD_DIR}"
    cp -rf -- "${flutter_appframework_path}${flutter_appframework_plist}" "${PRODUCT_GIT_BUILD_DIR}"

    cp -rf -- "${flutter_flutterframework_path}" "${PRODUCT_GIT_BUILD_DIR}/${flutter_flutterframework}"


    cp -rf -- "${flutter_plugin_registrant_path}" "${PRODUCT_GIT_BUILD_DIR}/${flutter_plugin_registrant}"

    local flutter_plugin="${ROOT_PATH}/.flutter-plugins"
    if [ -e $flutter_plugin ]; then
        OLD_IFS="$IFS"
        IFS="="
        cat ${flutter_plugin} | while read plugin; do
            local plugin_info=($plugin)


                local plugin_name=${plugin_info[0]}
             echo "Start copy ${plugin_name}"
                local plugin_path=${plugin_info[1]}

                if [ -e ${plugin_path} ]; then
                    local plugin_path_ios="${plugin_path}ios"
                    if [ -e ${plugin_path_ios} ]; then
                     if [ -s ${plugin_path_ios} ]; then
                            echo "copy plugin 'plugin_name' from '${plugin_path_ios}' to '${PRODUCT_GIT_BUILD_DIR}/${plugin_name}'"
                            cp -rf ${plugin_path_ios} "${PRODUCT_GIT_BUILD_DIR}/${plugin_name}"
                        fi
                    fi
    fi
    done

        IFS="$OLD_IFS"
    fi

    echo "Finish copy flutter app plugin"
}

upload_product() {
    echo "=================================upload product"

    pushd ${ROOT_PATH}
   
    echo "Start copy "
    popd

    pushd ${PRODUCT_GIT_DIR}
    
    git add .
    git commit -m "Flutter product"
    git push

    popd 
}

flutter_copy_packages
upload_product

2.上iOS工程中添加flutter产物的subModule

在iOS工程的根目录下添加subModule

git submodule add https://github.com/haohongwei/xxx.git flutter_production

更新iOS工程

 git submoudle init
 git submodule update

这样就把上传到git上的flutter 产物下载到iOS工程中

3.修改Flutter产物的Pod的路径

修改podfile文件添加修改Pod路径的方法:

      flutter_production_path = "#{dir}/ios_product/#{USE_FLUTTER_PRODUCTION_TYPE}"
    install_all_native_flutter_pods(flutter_production_path)
  end

install_all_native_flutter_pods也是在文件podhelper.rb中实现的:

def install_all_native_flutter_pods(flutter_application_path = nil)
#  flutter_application_path ||= File.join('..', '..')
  nativemode = 0;
  install_native_flutter_engine_pod(flutter_application_path)
  install_native_flutter_plugin_pods(flutter_application_path)
  install_native_flutter_application_pod(flutter_application_path)
end

# Install Flutter engine pod.
#
# @example
#   target 'MyApp' do
#     install_flutter_engine_pod
#   end
def install_native_flutter_engine_pod(flutter_application_path)
  engine_dir = File.join(flutter_application_path, 'engine')

  # Keep pod path relative so it can be checked into Podfile.lock.
  # Process will be run from project directory.
  engine_pathname = Pathname.new engine_dir
  puts "engine_dir: #{engine_pathname}"
  project_directory_pathname = Pathname.new Dir.pwd
  puts "project_directory_pathname: #{project_directory_pathname}"
  relative = engine_pathname.relative_path_from project_directory_pathname
  puts "relative: #{relative}"
  puts "engine_pathname.relative_path_from project_directory_pathname: #{relative}"
  pod 'Flutter', :path => relative.to_s, :inhibit_warnings => true
end

# Install Flutter plugin pods.
#
# @example
#   target 'MyApp' do
#     install_flutter_plugin_pods 'my_flutter'
#   end
# @param [String] flutter_application_path Path of the root directory of the Flutter module.
#                                          Optional, defaults to two levels up from the directory of this script.
#                                          MyApp/my_flutter/.ios/Flutter/../..
def install_native_flutter_plugin_pods(flutter_application_path)
  #flutter_application_path ||= File.join('..', '..')

  # Keep pod path relative so it can be checked into Podfile.lock.
  # Process will be run from project directory.
  current_directory_pathname = Pathname.new flutter_application_path
  project_directory_pathname = Pathname.new Dir.pwd
  relative = current_directory_pathname.relative_path_from project_directory_pathname


  Dir.foreach flutter_application_path do |sub|
        # 忽略隐藏文件
        if sub =~ /\.(.*)/ 
            next
        end
        if sub =='engine' 
            next
        end

       sub_abs_path = File.join(flutter_application_path, sub)
        puts "sub_abs_path: #{sub_abs_path}"
        pod sub, :path=>sub_abs_path, :inhibit_warnings => true
  end

end

# Install Flutter application pod.
#
# @example
#   target 'MyApp' do
#     install_flutter_application_pod '../flutter_settings_repository'
#   end
# @param [String] flutter_application_path Path of the root directory of the Flutter module.
#                                          Optional, defaults to two levels up from the directory of this script.
#                                          MyApp/my_flutter/.ios/Flutter/../..
def install_native_flutter_application_pod(flutter_application_path)
  app_framework_dir = File.join(flutter_application_path, 'App.framework')
  app_framework_dylib = File.join(app_framework_dir, 'App')
  if !File.exist?(app_framework_dylib)
    # Fake an App.framework to have something to link against if the xcode backend script has not run yet.
    # CocoaPods will not embed the framework on pod install (before any build phases can run) if the dylib does not exist.
    # Create a dummy dylib.
    FileUtils.mkdir_p(app_framework_dir)
    `echo "static const int Moo = 88;" | xcrun clang -x c -dynamiclib -o "#{app_framework_dylib}" -`
  end

  # Keep pod and script phase paths relative so they can be checked into source control.
  # Process will be run from project directory.
  current_directory_pathname = Pathname.new flutter_application_path
  project_directory_pathname = Pathname.new Dir.pwd
  relative = current_directory_pathname.relative_path_from project_directory_pathname
  pod 'flutter_xxx_xxx', :path => relative.to_s, :inhibit_warnings => true
end

这样就走通了整个流程。但是其中还有一些细节需要处理,比如:要同时兼容flutter开发同学和iOS原生开发同学的需求,因此在podfile中就要做条件判断,根据大家不同的需求来走不同的分支。


根据不同需求,走不同的编译流程

这几天会在github上创建一个示例工程,供大家参考。

Flutter工程:https://github.com/haohongwei/my_flutter
iOS工程:https://github.com/haohongwei/FlutterCI
Flutter产物git库:https://github.com/haohongwei/FlutterCI_FlutterProduction

你可能感兴趣的:(IOS Flutter混编工程的CI接入--实践篇)