Flutter - 热更新 Shorebird 1.0 正式版来了 🐦

欢迎关注微信公众号:FSA全栈行动 👋

一、概述

等了这么久,就在 4月9号 这一天,Shorebird1.0 正式版终于来了!本次最关心的还是对 iOS 的热更新支持得如何了,因为在之前的版本中,iOS 的性能表现简直差到无法使用~

先给个结论:iOS 端终于能用了!通过测试,iOS 端打完补丁后的性能表现已达上线水平 🥳

需要注意的是:

iOS 热更新稳定版本需要使用最新版本的 Shorebird CLI (1.0.0) 和最新稳定版本的 Flutter (3.19.5)

但是

对,但是,先不要着急用!

二、踩坑

我在发布的当天就升级到 1.0 来尝尝鲜,结果在打完补丁后,有几个页面灰屏了!!!

当时脑袋嗡嗡的,我就只改了文本的颜色,不至于吧~ 😕

根据控制台的报错的内容定位到了项目里以下两处代码(已简化)

dart 复制代码
bool _isExist(SomeType type) {
  try {
    final model = state.models.firstWhere(
      (element) => element.type == type,
    );
    return true;
  } catch (e) {
    return false;
  }
}
dart 复制代码
String value = '';
...
try {
  return json.decode(value);
} catch (e) {
  return null;
}

推测 tryCatch 失效了,然后我建了一个最小的 Demo 做测试,竟然一切正常。。。

然后开始忙需求去了,直到 4月15号 小伙伴说官方有提到相关说明,如下图所示

还真是 tryCatch 导致的,现在我们能做的就是静静的等待下个版本了。

三、脚本适配(混编)

关于基本使用,这里就不再赘述,有需要的小伙伴可以看我之前的两篇文章

我们接下来讲一讲升级到正式版后的一些调整

以下是 Shorebird1.00.22.1 版本之间的命令改动

ios-framework-alpha 改名为 ios-framework

diff 复制代码
- shorebird release ios-framework-alpha --release-version 7.0.0+1
+ shorebird release ios-framework --release-version 7.0.0+1

flutter versions use 废弃

现在你再按如下命令执行,会提示你找不到 use

shell 复制代码
shorebird flutter versions use 3.19.3
Could not find a subcommand named "use" for "shorebird flutter versions".

Usage: shorebird flutter versions <subcommand> [arguments]
-h, --help    Print this usage information.

Available subcommands:
  list   List available Flutter versions.

Run "shorebird help" to see global options.

如果你需要指定 Flutter 版本,就得在 release 命令中使用 --flutter-version

ini 复制代码
# 安卓
shorebird release aar --release-version=7.0.0+1 --flutter-version=3.19.5

# iOS
shorebird release ios-framework --release-version=7.0.0+1 --flutter-version=3.19.5

release--force 废弃

shell 复制代码
The --force flag has been deprecated
If you believe you have a valid reason to use the --force flag, please reach out to the Shorebird team by filing an issue at https://github.com/shorebirdtech/shorebird/issues/new
diff 复制代码
- shorebird release aar -f --release-version 7.0.0+1
+ shorebird release aar --release-version 7.0.0+1

Flutter 3.19 补丁

在【Flutter - 升级3.19之后页面多次rebuild?🤨】一文中有讲到补丁需要去到 Flutter 源码目录下执行。我们知道,Shorebird 的热更新是魔改 Flutter 实现的,所以我们就需要去找到用来打包时的魔改版 Flutter 的目录位置。

下载的 Flutter 源码统一存放在如下目录

shell 复制代码
~/.shorebird/bin/cache/flutter

.
├── 5b9d29d67adb059103beefb65710ee3dabae2f85
├── 771d07b2cf97cf107bae6eeedcf41bdc9db772fa
├── a3d5f7c614aa1cc4d6cb1506e74fd1c81678e68e
├── a6d1747d7f573b2ba2e2b96db1b76ed2f3f024da
└── b9b23902966504a9778f4c07e3a3487fa84dcb2a

但是目录中都是以 hash 码命名的目录,要找到对应版本的目录,可以查看如下文件里的值

shell 复制代码
~/.shorebird/bin/internal/flutter.version

# a6d1747d7f573b2ba2e2b96db1b76ed2f3f024da

如果原先的 flutter versions use 还能用的话,一切就很简单了,先切到对应的 Flutter 版本,然后 cat 一下该文件,拿到 hash 码就可以进入到对应版本的 Flutter 目录,但是它已经被废弃了,所以得换另一个思路。

我们依旧可以通过 flutter.version 拿到 hash 码,但是它是当前最新受支持的 Flutter 版本的,不过不慌,拿到后进入到该 Flutter 目录,因为它是以 git 的方式拉取下来的,所以有分支记录。

我们可以通过 git rev-parse 命令拿到指定版本的 hash

shell 复制代码
git rev-parse --verify refs/remotes/origin/flutter_release/3.19.3

# 得到如下输出
# 0addba5b750987523c04ebe69e9755509369615a

四、脚本使用(混编)

专门服务于混编项目的 Python 脚本,用于切换原生端集成 Flutter 的方式(源码 或 二进制),以及封装 Shorebird 命令的使用。

我们日常研发依旧使用的是源码依赖的方式,只会在打最终测试包时才需要通过脚本切到二进制依赖,并结合 Jenkins 来辅助完成这种万年不变的无聊步骤~

Github: github.com/LinXunFeng/...

switch_flutter_integrate.py

切换 Flutter 项目的集成方式

参数 描述
-p 原生工程路径
-f 平台(ios / android
shell 复制代码
# 二进制依赖
python switch_flutter_integrate.py -p '原生工程路径' -m 'binary' -f 'ios'

# 源码依赖
python switch_flutter_integrate.py -p '原生工程路径' -m 'source' -f 'ios' 

shorebird.py

自动获取版本号,并执行 Shorebird 相关命令

参数 描述
-p 原生工程路径
-s Flutter 工程路径
-m 模式 (release / patch
-f 平台(ios / android
--flutter_version Flutter 版本号,如:3.19.3
--patch_fix 是否打 3.19 补丁,如需要请传 1
shell 复制代码
# release
python shorebird.py -p '原生工程路径' -s 'Flutter工程路径' -m release -f ios
# 指定 Flutter 版本,以及打 3.19 的补丁
python shorebird.py -p '原生工程路径' -s 'Flutter工程路径' -m release -f ios --flutter_version=3.19.3 --patch_fix=1

# patch
python shorebird.py -p '原生工程路径' -s 'Flutter工程路径' -m patch -f ios

如果文章对您有所帮助, 请不吝点击关注一下我的微信公众号:FSA全栈行动, 这将是对我最大的激励. 公众号不仅有 iOS 技术,还有 AndroidFlutterPython 等文章, 可能有你想要了解的技能知识点哦~

相关推荐
Myli_ing5 分钟前
HTML的自动定义倒计时,这个配色存一下
前端·javascript·html
dr李四维22 分钟前
iOS构建版本以及Hbuilder打iOS的ipa包全流程
前端·笔记·ios·产品运营·产品经理·xcode
雯0609~43 分钟前
网页F12:缓存的使用(设值、取值、删除)
前端·缓存
℘团子এ1 小时前
vue3中如何上传文件到腾讯云的桶(cosbrowser)
前端·javascript·腾讯云
学习前端的小z1 小时前
【前端】深入理解 JavaScript 逻辑运算符的优先级与短路求值机制
开发语言·前端·javascript
彭世瑜1 小时前
ts: TypeScript跳过检查/忽略类型检查
前端·javascript·typescript
FØund4041 小时前
antd form.setFieldsValue问题总结
前端·react.js·typescript·html
Backstroke fish1 小时前
Token刷新机制
前端·javascript·vue.js·typescript·vue
小五Five1 小时前
TypeScript项目中Axios的封装
开发语言·前端·javascript
小曲程序1 小时前
vue3 封装request请求
java·前端·typescript·vue