集成flutter,集成灶的优点和缺点各是什么
Flutter工程化之iOS混编集成
在flutter官网上推荐了iOS项目中两种混编方式:
创新互联建站主要业务有网站营销策划、成都网站建设、成都网站设计、微信公众号开发、重庆小程序开发、H5技术、程序开发等业务。一次合作终身朋友,是我们奉行的宗旨;我们不仅仅把客户当客户,还把客户视为我们的合作伙伴,在开展业务的过程中,公司还积累了丰富的行业经验、全网营销推广资源和合作伙伴关系资源,并逐渐建立起规范的客户服务和保障体系。
笔者在采用两种集成方式的过程中,因为iOS项目结构设计导致这两种简单的集成方式都有些麻烦,所以在实践中更改和优化了集成方式,使之在笔者的项目中能够更加简单和快速的集成。
问题:在不更改flutter tool中相关脚本的前提下,添加的Script Phase中的脚本相对路径错误,如果只是开发,手动更改下路径就可以了,但是在考虑到CI中不能每次在pod install之后都去更改,所以在开发调试中采用该集成方式,结合flutter attach的方式去调试。
通过编译相关的 xcframework + Cocoapods私有库的集成方式在CI中集成,这样QA的CI不需要配置flutter的相关依赖
根据flutter编译工具的提示: 上面的编译命令是打包flutter工程项目和插件的产物,在实际开发过程中可以发现是否引入了依赖Native的插件会导致贬义编译产物的不同。
根据上面的对比:
第一部分:基础的 Flutter Engine + Flutter App 编译后的产物 Flutter.xcframwork -- Flutter引擎的包 App.xcframework -- 工程项目对应的AOT的编译产物 第二部分:三方插件的注册中心 FlutterPluginRegistrant.xcframework -- 第三方插件的注册中心,其实是Native + iOS通信的集合 第三部分:依赖iOS Native的原生 FMDB . xcframwork path_provider_ios.xcframework sqflite.xcframework -- cached_network_image依赖的原生实现
根据上面的编译产物可以知道Flutter和App是编译后必有的包,后面的两个部分完全是服务于三方插件的,到这可以解答第二个问题:笔者App的混编过程中混编插件失效是因为笔者在NativeApp中重写了Flutter的容器,使用了FlutterEngineGroup动态创建多引擎去对应进入不同的功能模块,混合插件是因为重写过程中没有通过GeneratedPluginRegistrant注册插件,所以需要在Native的Flutter容器中注册插件,使之生效。
在这为什么使用commit的hash作为flutter-libs的依赖,因为pod install的时候会有缓存,除了版本好,commit hash也能保证每次CI编译通过 pod install 来更新flutter-libs依赖产物
完成!!!
iOS(Swift版)Flutter集成关键步骤
1.在项目目录执行 flutter create -t module XXX(flutter模块名) ;
2.修改Podfile,设置path,关联podhelper.rb,注意采用 load File.join() ,不采用之前的eval语句,在target do下install;
3.执行pod install;
4.修改AppDelegate为FlutterAppDelegate;
5.初始化并注册FlutterEngine;
6.vscode里flutter attach实时调试;
做完这些正常开发是可以了,至于打包需要更改什么再续。
Flutter集成子module联调的解决方案
这里我们以钱包项目举例
我们先建一个文件夹 Wallets 用来存放所有钱包项目需要联调的 Module 。如下图我们将所有需要联调的 Module 都存放到 Wallets 文件夹中。
做好上面的上面的准备后,我们用AS打开Wallets 文件夹,此时AS导航栏侧我们看到所有需要联调的子Module都在这里了
这时我们看到AS找不我们的入口文件
所以我们需要给AS设置一下,告诉AS我们的入口文件在哪里,点击上图红框选中的部分弹出下面的对话框
点击上图中箭头指向的+,弹出下面对话框
选择展开所有列表,选中Flutter,如下图所示
在弹出的对话框中按图中标注的操作
在弹出的对话框中按图中标注的操作
上面操作都完成之后回到下面的对话框可以看到Fix已经没有了,然后再按下图中所示操作
都操作好后就回到了AS开发主界面了,可以看到主界面上的入口文件已经显示了,运行按钮也可以点击了
Xcode 项目集成flutter
一、cocopods版本升到1.10.0以上
二、podfile添加这些(flutter_module路径和.git路径相同)
三、命令行cd到 flutter_module 下,执行 flutter pub get
四、pod下面添加“ install_framework "${PODS_ROOT}/../../flutter_module/.ios/Flutter/App.framework" ”
已有iOS项目集成Flutter遇到的一些坑
1.XCode10.3,CocoaPods1.7.5, Flutter 1.8.4-pre.65(一定是master channel,不能是stable), 根据标题中的环境对应的版本自行升级,如版本高太多的话不敢保证一定会成功。
2.参照官方文档的iOS部分很快就构建好了,于是Commod+B构建,可是马上会遇到第一个坑,如下图:
ld: warning: directory not found for option '-L/Users/wang/Library/Developer/Xcode/DerivedData/test_flutter-dbqsilcpjusqpadpdwvgsoqctumw/Build/Products/Debug-iphonesimulator/FlutterPluginRegistrant'
ld: library not found for -lFlutterPluginRegistrant
clang: error: linker command failed with exit code 1 (use -v to see invocation)
我晕这是什么鬼啊,尝试了各种方式都无效:
怀疑是没有找到静态库 lib(FlutterPluginRegistrant.a),工程目录和flutter_module目录以及flutterSDK的安装目录都搜遍了,也没有发现这个文件。。。。。。
于是怀疑是新版本的Flutter将FlutterPluginRegistrant.a移除了,根本就不存在这个文件,接下来在宿主iOS工程下的Pods目录中的『Pods-test_flutter.debug.xcconfig』文件中搜索" FlutterPluginRegistrant ",果然发现了一些线索
接下来将 带有 『 FlutterPluginRegistrant 』内容的部分全部删除( Pods-test_flutter.debug.xcconfig也如法炮制 ),修改后的配置如下:
接下来Command+B再次构建,奇迹发生了,刚才的错误消失了,继续往下走,
参照官方文档将 Appdelegate.m文件改为如下内容
Command+B走起,然而第二个坑来了,
Undefined symbols for architecture x86_64:
"_OBJC_CLASS_$_GeneratedPluginRegistrant", referenced from:
objc-class-ref in AppDelegate.o
ld: symbol(s) not found for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)
彻底晕倒,这又是什么鬼。。。自习一看才发试一个经典错误,原来是编译期的符号表$_GeneratedPluginRegistrant在链接期间找不到,由于GeneratedPluginRegistrant是在FlutterPluginRegistrant中定义的,这更加说明了FlutterPluginRegistrant.a根本不存在,于是接下去到刚才用命令"flutter create -t module --org com.example flutter_module"构建的 flutter_module 目录中去搜索文件GeneratedPluginRegistrant(mac系统下用finder搜索小伙伴们一定都会了),果然有所收获,在../flutter_module/.ios/Flutter/FlutterPluginRegistrant/Classes/目录下发现了两个文件GeneratedPluginRegistrant.h和GeneratedPluginRegistrant.m,这下就好办了,在宿主工程中把这两个文件添加进来,方式任意,可以reference也可以copy过来。
二话不说马上Command+B构建工程,大功告成!!可以来支烟庆祝一下了!
希望此文可以帮助迷茫中的你走出困境,现在网上关于这个错误的解决方案少之甚少,如果看到这里,此时你的问题已经得到解决了!!
网站名称:集成flutter,集成灶的优点和缺点各是什么
文章起源:http://scyanting.com/article/dsipsch.html