iOS原生嵌入flutter模块, flutter attach调试

简介

一旦将flutter模块集成到原生项目中，由其是iOS的原生项目，我们是否能够保留flutter的快速开发调试的优势呢？
即是否还可以通过Hot reload 或者 Hot Restart来快速开发呢？
那么对应flutter模块，我们如何使用hot reload加速我们的调试速度呢？

答案就是：flutter attach 调试 （开发工具：Xcode 、Visual Studio Code 、Android Studio ）

一：Visual Studio Code

1、 Xcode 启动原生项目 （此处flutter模块已嵌入原生,
2、创建launch.json 文件 如下图

截屏2022-04-21 下午1.38.16.png

3、VSCode 编辑 launch.json -> 追加如下代码：

{
    "name": "Flutter: Attach to Device",
    "type": "dart",
    "request": "attach"
}

截屏2022-04-19 下午4.38.17.png

4、如下图选中刚刚配置的 "request": "attach" 点击 Run

截屏2022-04-19 下午4.40.06.png

5、完成配置 现在可在iOS 断点Xcode 中调试，Flutter VSCode 中断点调试

二：Android Studio

1、Xcode 启动原生项目 （此处flutter模块已嵌入原生,

2、Android Studio 中打开终端输入 flutter attach 命令（展示可用模拟器列表，仅有一个则跳过此步）

bogon:test_flutter zhanghua$ flutter attach
Multiple devices found:
iPhone 11 Pro Max (mobile) • E1D101FB-F1A5-404F-B3FF-BD981B04B271 • ios •         com.apple.CoreSimulator.SimRuntime.iOS-15-2 (simulator)
iPhone 13 Pro Max (mobile) • AD044D50-3DCC-495A-9D96-981349214F67 • ios •     com.apple.CoreSimulator.SimRuntime.iOS-15-2 (simulator)
[1]: iPhone 11 Pro Max (E1D101FB-F1A5-404F-B3FF-BD981B04B271)
[2]: iPhone 13 Pro Max (AD044D50-3DCC-495A-9D96-981349214F67)
Please choose one (To quit, press "q/Q"): q
bogon:test_flutter zhanghua$ 

3、执行 flutter attach -d <设备ID> 命令选择要启动的模拟器 (无下面报错，跳过此步)

bogon:test_flutter zhanghua$ flutter attach -d AD044D50-3DCC-495A-9D96-981349214F67
There are multiple observatory ports available.
Rerun this command with one of the following passed in as the appId:
     flutter attach -- app-id com.example.myFlutter
     flutter attach -- app-id com.test.flutter
bogon:test_flutter zhanghua$ 

4、执行 flutter attach -- app-id com.test.flutter -d AD044D50-3DCC-495A-9D96-981349214F67 命令

bogon:test_flutter zhanghua$ flutter attach -- app-id com.test.flutter -d AD044D50-3DCC-495A-9D96-981349214F67
Syncing files to device iPhone 13 Pro Max...                       13.5s

Flutter run key commands.
r Hot reload. 
R Hot restart.
h Repeat this help message.
d Detach (terminate "flutter run" but leave application running).
c Clear the screen
q Quit (terminate the application on the device).

Running with unsound null safety
For more information see https://dart.dev/null-safety/unsound-null-safety

An Observatory debugger and profiler on iPhone 13 Pro Max is available at: http://127.0.0.1:64089/wiDHmXpmDXo=/
The Flutter DevTools debugger and profiler on iPhone 13 Pro Max is available at: http://127.0.0.1:9103?uri=http%3A%2F    %2F127.0.0.1%3A64089%2FwiDHmXpmDXo%3D%2F

5、到此快快在 Android Studio 中修改 flutter 模块代码 ，在终端中执行 r 或者 R 看看模拟器中样式是否 随之变化吧 。

注意：只有一个模拟器设备的话 ，执行 flutter attach 命令后将跳过步骤2、3,直接展示 小 4 步骤结果 .

---

文章持续更新中、希望对各位有所帮助、有问题可留言 大家共同学习.