一 搭建环境

1. 搭建flutter环境

1.1 搭建系统开发环境

参考链接：https://flutter.cn/docs/get-started/install/macos

1.2 搭建flutter模块

在创建好的文件路径下使用命令：

flutter create --template module flutter_module

如下在FRTest中生成了flutter_module：

图片1.png

2 搭建React Native环境

2.1 搭建系统开发环境

参考链接：https://reactnative.cn/docs/getting-started

2.2 创建RN项目

在和flutter 模块同级目录下使用命令建立RN工程：

  npx react-native init FRTest

如下生成了FRTest项目：

图片2.png

3 关联配置

3.1 打开RN中的ios工程运行，确保运行正常

3.2 RN项目中建立flutter环境

在项目Podfile文件中添加flutter模块

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

如下图所示:

图片3.png

添加完成后pod install，运行程序正常表示环境已经搭建成功。

注意：在info.plist文件中要删除Exception Domains，不然运行Flutter代码会报错

图片4.png