iOS 开发之仿咸鱼初期在老项目引入集成 Flutter【生产中不建议采用此方案】_flutter_build_name 始终为1.0.0?

 

【Flutter 环境配置传送门】

 

1、在工程目录执行如下命令引入 flutter 配置

flutter create -t module flutter_module

补充：添加 flutter 依赖库流程：

cd flutter_module
 
vim pubspec.yaml // (编辑 pubspec.yaml（类似于iOS Podfile） 添加需要引入的库，例如官方Demo中的 english_words: ^3.1.0)
 
flutter packages get // 更新配置

之后工程结构大致如下，红框内的文件是需要在第四步中引入到Xcode内的产物。

2、Xcode内添加对应 XX.xcconfig 文件

（为的是引入对应 xcode_backend.sh 脚本的环境变量）

release.xcconfig

#include "flutter.xcconfig"
 
FLUTTER_BUILD_MODE=release
 
// 如果使用了POD，需要将pod的配置再次引入
 
#include "Pods/Target Support Files/Pods-flutter_sdk_test/Pods-flutter_sdk_test.release.xcconfig"

debug..xcconfig

#include "flutter.xcconfig"
 
// 如果使用了POD，需要将pod的配置再次引入
 
#include "Pods/Target Support Files/Pods-flutter_sdk_test/Pods-flutter_sdk_test.debug.xcconfig"

flutter.xcconfig

#include "./flutter_module/.ios/Flutter/Generated.xcconfig"
 
ENABLE_BITCODE=NO

备注：Generated.xcconfig内容（在执行完第一步的命令后会自动生成）：

// This is a generated file; do not edit or check into version control.
 
FLUTTER_ROOT=/Users/yaheng/.flutterLib
 
FLUTTER_APPLICATION_PATH=/Users/yaheng/mySelf/Flutter/my_demo/flutter_sdk_test/flutter_module
 
FLUTTER_TARGET=/Users/yaheng/mySelf/Flutter/my_demo/flutter_sdk_test/flutter_module/lib/main.dart
 
FLUTTER_BUILD_DIR=build
 
SYMROOT=${SOURCE_ROOT}/../build/ios
 
FLUTTER_BUILD_NAME=1.0.0
 
FLUTTER_BUILD_NUMBER=1

Xcode 工程内修改编译配置如下

3、在iOS工程里添加运行脚本 Build Phases（创建Run Scrip）

"$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh" build

并且确保 Run Script 这一行在 "Target dependencies" 以及 "Check Pods Manifest.lock" 之后。

4、添加flutter产物引用

4.1、Framework * 2

1. 在 Embedded Binaries 内点击 + 号添加
2. 点击 Add Other...
3. 进入 flutter_module/.ios/Flutter/ （看不到 .ios 隐藏文件可在该文件夹内同时按住 shift+command+. 开启显示）
4. 选中 App.framework
5. 注意引用形式选择 Create folder references
6. flutter_module/.ios/Flutter/engine/Flutter.framework 的引用重复步骤1~5

4.2、assets

1. Xcode项目内添加资源引用
2. flutter_module/.ios/Flutter/flutter_assets
3. 注意引用形式选择 Create folder references

如若找不到上述的三个文件，可在添加完步骤三之后，CMD + R 先运行一下工程，便于对应文件的生成。

最终的文件引用形式示例：

 

5、编写 Flutter 代码 flutter_module/lib/main.dart ，使用 Xcode 运行后即可查看效果。

最简加载 Flutter 界面代码示例：

#import <Flutter/Flutter.h>
 
FlutterViewController *viewController = [FlutterViewController new];
 
[self.navigationController pushViewController:viewController animated:YES];

写在最后：

已有项目集成 Flutter 就先讨论到这，但是这么集成， Flitter 的工程代码是耦合进 Xcode 原工程内的，不过大家可以先通过这个集成逻辑大概了解到整体的流程，之后我们继续讨论如何隔离并同时集成进安卓项目中^_^~

注意：flutter_assets 文件内引入的资源在上线之前注意要仔细核实一遍是否有不需要的文件。

PS镇楼图 尽量不要像先驱【咸鱼】一样莫名的将一张 130KB 的测试图随包发版上线...