Flutter - 搭建引擎调试环境(iOS)

这篇具有很好参考价值的文章主要介绍了Flutter - 搭建引擎调试环境(iOS)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。


前言

刚开始学Flutter开发时搭建过,没有记录。现在有需要时又忘了,果然好记性不如烂笔头。

注意,调试环境搭建会占用较大硬盘空间。粗略统计,Flutter引擎项目(包含依赖的第三方库)约20GB,host_debug_unopt构建编译后约16GB,ios_debug_xxx构建编译后约5GB。所以如果想搭建成功,至少需要准备41GB的剩余硬盘空间。

开发环境

  • macOS: 13.3.1
  • Flutter: 3.7.12
  • Xcode: 14.3

安装依赖环境

1. python3

后续很多工具依赖python环境,如果执行python3命令失败,那么需要先安装python3。可以通过官网下载安装或brew命令安装:

brew install python

安装过程可能会遇到这样的问题:

Error: python@3.11: the bottle needs the Apple Command Line Tools to be installed.
  You can install them, if desired, with:
    xcode-select --install

执行xcode-select --install命令安装Xcode命令行工具解决。

2. depot_tools

depot_tools是Chromium的源码管理工具,后续获取源码和构建编译都需要用到。

安装流程:

  1. 切换到想要存放的路径执行clone命令(需要代理)
git clone https://chromium.googlesource.com/chromium/tools/depot_tools.git
  1. 配置环境变量

~/.bashrc~/.zshrc文件中加上:

export PATH=[存放的路径]/depot_tools:$PATH

参考文档:

  • Getting dependencies
  • depot_tools_tutorial

获取引擎项目

按Flutter的文档应先fork项目,不过那是针对贡献者的流程,如果你只是调试,可以跳过这一流程。

1. 创建engine空目录

切换到想要存放Flutter引擎源码的位置新建engine目录:

mkdir engine

2. 创建.gclient文件并配置

切换到engine目录下执行:

touch .gclient

配置.gclient文件:

solutions = [{
	"managed": False,
	"name": "src/flutter",
	"url": "git@github.com:<your_name_here>/engine.git",
	"custom_deps": {},
	"deps_file": "DEPS",
	"safesync_url": "",
}, ]

<your_name_here>请按需替换,如果没有fork引擎项目,可以替换为flutter,如果有fork,可以替换为自己的Github账户名。

如果想了解这些配置的作用,参考官方文档:gclient file。

3. 指定引擎版本

前面的配置获取的是最新的Flutter引擎源码,但是Flutter引擎的调试离不开Flutter框架,如果版本不匹配可能会遇到一些问题,所以最好指定Flutter引擎版本为当前Flutter框架所需要的版本。那么这个版本怎么指定呢?

Flutter引擎版本其实就是commit id,可以在Flutter SDK目录/bin/internal/engine.version文件中获得。例如我当前电脑的Flutter版本是3.7.12engine.version文件位于/opt/homebrew/Caskroom/flutter/3.7.12/flutter/bin/internal/目录,引擎版本是:

1a65d409c7a1438a34d21b60bf30a6fd5db59314

既然Flutter引擎版本是commit id,那么就可以通过修改前面的配置指定版本。修改后:

solutions = [{
	"managed": False,
	"name": "src/flutter",
	"url": "git@github.com:<your_name_here>/engine.git@1a65d409c7a1438a34d21b60bf30a6fd5db59314",
	"custom_deps": {},
	"deps_file": "DEPS",
	"safesync_url": "",
}, ]

4. 同步引擎源码

engine目录下执行(需要代理):

gclient sync

项目有点大,大概需要下载10GB,其中很大一部分是在下载依赖的第三方库,后续编译也相当耗时。

同步成功后,engine目录下会有一个src目录,如果在这个路径下执行git log,会发现commit id好像有点不对:

commit 8747bce41d0dc6d9dc45c4d1b46d2100bb9ee688 (HEAD)
Author: Jenn Magder <magder@google.com>
Date:   Wed Nov 30 14:05:32 2022 -0800

    Sort macOS SDK paths to keep order stable between runs (#652)
...

别急,真正的引擎项目在src目录下的flutter目录。src目录中的项目是这个buildroot,用于搭建Flutter引擎的构建环境。

5. 切换引擎版本

如果后续需要切换其他版本,请按以下步骤操作:

  1. 切换到engine/src/flutter目录路径下
  2. 指定新版本的commit id
git reset --hard [commit id]
  1. 同步新版本的引擎源码
gclient sync -D --with_branch_heads --with_tags

参考文档:

  • Getting the source

搭建调试环境

1. 构建编译

注意,以下所有命令都在engine/src目录路径下运行。

1.1 生成构建所需文件

1.1.1 主机端
flutter/tools/gn --unoptimized

生成的文件存放于engine/src/out/host_debug_unopt目录。

1.1.2 iOS端
  • 真机调试
flutter/tools/gn --ios --unoptimized

生成的文件存放于engine/src/out/ios_debug_unopt目录。

  • 模拟器调试
flutter/tools/gn --ios --simulator --unoptimized
# 如果是M系列芯片电脑,建议加上--simulator-cpu=arm64参数,用于支持arm64架构的模拟器
flutter/tools/gn --ios --simulator --simulator-cpu=arm64 --unoptimized

生成的文件存放于engine/src/out/ios_debug_sim_unoptengine/src/out/ios_debug_sim_unopt_arm64目录。

如果是M系列芯片电脑,没有加上--simulator-cpu=arm64参数,后续Xcode模拟器调试可能会遇到没有iOS设备可选择的情况:

Flutter - 搭建引擎调试环境(iOS)

解决方法:按这个步骤[Xcode菜单栏] -> [Product] -> [Destination] -> [Destination Architectures] -> [Show Both]操作,显示全部iOS模拟器。

以上只生成了Debug模式相关的文件用于后续调试,如果需要更多模式(Profile/Release等),可以参考文档Flutter’s modes或通过flutter/tools/gn -h命令了解更多用法。

1.2 完成构建编译

  • 真机调试
ninja -C out/ios_debug_unopt && ninja -C out/host_debug_unopt
  • 模拟器调试
ninja -C out/ios_debug_sim_unopt && ninja -C out/host_debug_unopt
# 如果前面使用了--simulator-cpu=arm64参数
ninja -C out/ios_debug_sim_unopt_arm64 && ninja -C out/host_debug_unopt

首次构建编译比较耗时,CPU会满载(电脑买来这么久一直没转过的风扇终于了有表现的机会😂)。后面调试过程中,如果修改了源码需要重新执行构建编译命令。如果文件有增删,需要重新执行前面生成构建所需文件的命令。

参考文档:

  • Compiling for iOS (from macOS)

2. Xcode调试

准备一个用于调试的Flutter项目,以下命令都在该项目目录路径下执行。

2.1 设置本地引擎

官方文档Debugging iOS builds with Xcode是通过flutter build命令设置:

flutter build ios --local-engine ios_debug_unopt --config-only

这种方式对于模拟器调试不是那么好用,所以我选择flutter run命令,设置项目本地引擎后还会运行一遍项目,在后续用Xcode调试时还能提前避免一些问题。

flutter run --local-engine=ios_debug_xxx --local-engine-src-path=/xxx/engine/src -d xxx
  • --local-engine:设置本地引擎名称,例如真机调试为ios_debug_unopt,模拟器调试为ios_debug_sim_unoptios_debug_sim_unopt_arm64
  • --local-engine-src-path:设置本地引擎源路径,engine/src目录所在的绝对路径
  • -d:指定要运行的设备名称,例如模拟器iPhone\ 8(名称有空格时需要转义或加单/双引号)

如果Flutter项目的入口文件路径不是默认的,需要追加-t xxx参数;如果有使用多环境配置,那可能需要追加--flavor xxx参数。

设置成功后,Flutter项目下的ios/Flutter/Generated.xcconfig文件会增加以下设置:

FLUTTER_ENGINE=/xxx/engine/src
LOCAL_ENGINE=ios_debug_xxx

2.2 导入引擎项目

  1. 检查Xcode项目是否存在工作空间

如果用于调试的Flutter项目不存在ios/Runner.xcworkspace文件,可以先随意依赖一个Flutter插件库,然后执行前面的flutter run ...命令快速创建工作空间。注意,不能用Android Studio直接运行Flutter项目,否则项目本地引擎设置会被重置。

  1. 导入引擎项目到工作空间(任选一种方式)
  • 简单拖拽

用Xcode打开用于调试的Flutter项目(打开ios/Runner.xcworkspace文件),将ios_debug_xxx目录下的flutter_engine.xcodeproj文件拖到Xcode的左侧项目导航区:

Flutter - 搭建引擎调试环境(iOS)

  • 修改配置

选中ios/Runner.xcworkspace文件,右键显示包内容即可找到contents.xcworkspacedata配置文件。打开后增加一条FileRef配置:

<?xml version="1.0" encoding="UTF-8"?>
<Workspace version = "1.0">
   ...
   <FileRef
      location = "group:/xxx/engine/src/out/ios_debug_xxx/flutter_engine.xcodeproj">
   </FileRef>
</Workspace>

以上两种方式本质是一样的。到此,准备工作都做完了,可以开始调试啦🎉!

2.3 测试调试功能

先找个地方打断点,从AppDelegate.swift文件的FlutterAppDelegate可以来到引擎项目,在这打断点肯定会进到调试:

Flutter - 搭建引擎调试环境(iOS)

使用Xcode运行项目一切正常,成功进入调试:

Flutter - 搭建引擎调试环境(iOS)

如果调试过程中发现变量列表显示不全,可以将左下角的筛选项Auto改为All

Flutter - 搭建引擎调试环境(iOS)

最后

如果这篇文章对你有所帮助,请不要吝啬你的点赞👍加星🌟,谢谢~文章来源地址https://www.toymoban.com/news/detail-454730.html

到了这里,关于Flutter - 搭建引擎调试环境(iOS)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • iOS- flutter flavor 多环境Configurations配置

    在这里我添加了4个Scheme,Dev、Test、MTest、Prod。 同时,在 Info.plist 的 Bundle display name 选项中,输入: ${APP_DISPLAY_NAME} 比如,我创建了Test环境,那首先选择Test的Scheme,点击编辑,进入下图流程:

    2024年02月07日
    浏览(49)
  • 如何搭建flutter开发环境

    学习Flutter,首先需要搭建好Flutter的开发环境,下面我将一步步带领大家搭建开发环境并且成功运行flutter项目。 操作系统:windows7以上64位操作系统 git环境:flutter需要git环境的支持 因为Flutter是基于Android的,所以要安装Java环境 Java环境下载地址:https://www.oracle.com/java/technol

    2024年02月11日
    浏览(41)
  • MacOS搭建Flutter 环境

    第一步:官网下载对应版本的flutter SDK MacOS有两个版本:x64和 arm64 查看命令:uname -a 官网链接:Flutter SDK archive | Flutter 下载成功后会自动解压,把Flutter文件放到自己指定的位置。 第二步:打开控制进行临时配置 第三步:进入自己的工具(Android studio/vs code),在设置中配置flu

    2024年02月07日
    浏览(55)
  • flutter项目 环境搭建

    开发flutter项目 搭建工具环境 flutter项目本身 所需开发工具环境 flutter 谷歌公司开发 系统支持库 镜像库 搭建流程: flutter 官网: https://flutter.dev/community/china //步骤1 .bash_profile touch .bash_profile pwd /Users/haijunyan open ~ export PUB_HOSTED_URL=https://pub.flutter-io.cn export FLUTTER_STORAGE_BASE_URL=h

    2024年02月12日
    浏览(34)
  • flutter 环境搭建异常记录

    flutter 环境搭建异常记录 1.执行flutter doctor自检报错 排查Android studio里配置的sdk是哪个 SDK Platforms选中 8.0 SDkTools也只勾选8.0 2.bash_profile 文件配置 没有的话 在根目录新建 export PUB_HOSTED_URL=https://pub.flutter-io.cn export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn export PATH=~/development/flu

    2024年01月22日
    浏览(39)
  • Flutter系列文章-Flutter环境搭建和Dart基础

    Flutter是Google推出的一个开源的、高性能的移动应用开发框架,可以用一套代码库开发Android和iOS应用。Dart则是Flutter所使用的编程语言。让我们来看看如何搭建Flutter开发环境,并了解Dart语言的基础知识。 1. 安装Flutter SDK 首先,访问Flutter官网下载Flutter SDK。选择适合你操作系统

    2024年02月15日
    浏览(49)
  • Flutter的开发环境搭建-图解

    前言:Flutter作为一个移动应用开发框架,具有许多优点和一些局限性。最大的优点就是-跨平台开发:Flutter可以在iOS和Android等多个平台上进行跨平台开发,使用一套代码编写应用程序,节省开发时间和成本。 Flutter可以编译出以下平台的程序: 1. Android:Flutter可以生成Androi

    2024年02月15日
    浏览(54)
  • Android Flutter开发环境搭建

    本栏亦在快速上手Android Flutter,Flutter框架就不介绍了,框架这个东西怎么说呢,对于大部分人来说只是了解即可,如需了解的话,可以度娘资料很多。 本节我们主要看下如何在Windwos下搭建Android Flutter开发环境,然后了解下IDE上面的Flutter开发。 要安装并运行Flutter,您的开发

    2024年02月09日
    浏览(50)
  • flutter在windows环境搭建

    下载flutter https://flutter.cn/docs/development/tools/sdk/releases 下载相应的版本 我放在C盘下: 环境变量 再加系统变量: PUB_HOSTED_URL=https://pub.flutter-io.cn 如图 FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn 完成

    2024年01月22日
    浏览(38)
  • Flutter开发②环境搭建及入口

    目录 Window Android环境搭建 安装配置 安装配置JDK 下载安装Android Studio 下载配置Flutter SDK  电脑上配置Flutter国内镜像 ​编辑 运行flutter doctor命令检测环境是否配置成功 Android Studio安装Flullter插件 找不到运行的设备  Flutter Android真机调试及VScode开发flutter应用 Flutter虚拟机模拟器

    2024年03月28日
    浏览(93)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包