【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 的測試圖隨包發版上線...