前言

你已经有了iOS工程，想集成flutter模块到现有工程实现混合开发

一、现有工程集成flutter模块方式

一共有2种方式：

1、Frameworks方式集成

2、CocoaPods集成(可以热重载，推荐使用)

二、Frameworks集成方式

假如你的现有iOS工程是"FlutteriOSDemo"，flutter工程是“flutterdemo”
在iOS工程目录下新建一个文件夹，我这里命名为“Flutter”，如图：

image.png

cd到flutter工程，执行命令如下：

flutter build ios-framework --output=/Users/mybook/Desktop/FlutterNativeDemo/FlutteriOSDemo/Flutter

/Users/mybook/Desktop/FlutterNativeDemo/FlutteriOSDemo/Flutter 这个为iOS工程里“Flutter”文件夹路径

此命令会将flutter工程打包为framework，存放在“Flutter”文件夹中，生成三种环境的framework，如图：

image.png

每个文件夹下有两个framework，如图：

image.png

打开iOS工程，选择一种环境的framework拖到工程的Link Binary With Libraries下：

注意：Embed选择Embed & Sign

image.png

至此，flutter就集成到了iOS工程中了，你可以到AppDelegate.h引入flutter库，就可以开发了

image.png
注意⚠️：

\color{red}{如果修改了flutter代码，需要重新生成framework导入iOS工程}

三、CocoaPods集成

你需要准备好iOS工程和flutter module工程，并且它们在同一文件夹下。
小编这里现有iOS工程是"IOSAppDemo"，flutter module工程是“fluttermodule”。
注意⚠️： $\color{red}{flutter工程是一个module，不是application}$

如何创建flutter module

1、命令行方式
cd你想要存放flutter module的文件夹下(与iOS工程是同一个目录)

$ flutter create --template module fluttermodule

2、vs code创建方式
第一步：
用vs code打开命令面板（快捷键shift + command + P），输入Flutter: New Peoject

image.png

第二步：
选择Module，然后输入名称即可

image.png

在iOS工程Podfile里添加配置

如果你的iOS工程还没有创建Podflile，cd到你的iOS工程，执行以下命令:

$ vim Podfile

然后添加如下代码:

flutter_application_path = '../fluttermodule'
load File.join(flutter_application_path, '.ios', 'Flutter', 'podhelper.rb')

target "IOSAppDemo" do

use_frameworks!
install_all_flutter_pods(flutter_application_path)

end

post_install do |installer|
  flutter_post_install(installer) if defined?(flutter_post_install)
end

最后pod install