小程序框架升级探究：多框架打包

依辰
184 阅读3分钟

问题：

SCRM小程序框架为Wepy1.6.0，Wepy文档地址：github.com/Tencent/wep…

当前维护一个Taro3.x版本的移动端组件库，如果不能在SCRM小程序中使用，感觉有点可惜。

目标：

期望的结果是可以在SCRM小程序中使用Taro3.x版本的组件开发页面，需要为此找到一个可实施的方案。

方案探究：

尝试1：Wepy升级Taro

框架迁移社区暂未比较合理方案，不太能快速改造。即：Wepy->Taro

那么当前剩下的只有新增一个Taro项目，然后按照之前的页面功能重新开发。这样迁移的代码量级是最大，但是不太建议这样升级。

尝试2：使用webview

使用Taro.3.x可以开发H5的能力，然后使用小程序的webview内嵌H5的模块，这是一个当前看起来比较合理的方案。

结合当前项目的需求，期待webview开发的页面可以满足如下能力：

  1. 可以实现webview与原生页面相互跳转
  2. 可以实现webview与原生页面的数据通信
  3. 可以实现webview直接唤起企微官方页面如好友信息页面、打电话、加企微好友等（业务需求）
  4. 使用webview考虑是否能实现原生页面的流畅度（原生和H5斗争）

如果以上能力不能满足，该方案就不算完整，或者说在考虑使用Taro开发H5页面的时候要考虑规避这些不足。

whiteboard_exported_image.png

尝试3：小程序插件

使用小程序插件，可以保证两个不同的框架在一起使用。但使用插件需要考虑插件的审核周期以及是否需要多个插件去区分环境：测试、预发布、线上。

在使用小程序插件的过程中，探究了两个问题：

  1. 使用小程序插件开发页面
  2. 使用小程序插件提供Taro3.x的组件

以下介绍小程序插件提供Taro3.x组件在Wepy中的使用示例（日历组件）：

// 引入组件
usingComponents: {
 calendar: 'plugin://scrmMiniPlugin/calendar'
}

// 日历组件参数
this.calendarprops = {
  visible: false,
  defaultValue: [startDate, endDate],
  startDate: '1997-01-11',
  endDate: endDate,
  type: 'range',
  title: '任务时间',
  onClose: this.onClose.bind(this),
  onConfirm: this.onConfirm.bind(this)
};

// taro3.x的日历组件
<calendar props="{{ calendarprops }}"></calendar>

尝试4：小程序分包

微信小程序分包加载文档地址：developers.weixin.qq.com/miniprogram…

在文档中我们找到以下内容：

  1. 独立分包是小程序中一种特殊类型的分包，可以独立于主包和其他分包运行
  2. 独立分包中不能依赖主包和其他分包中的内容

思考：独立分包可以独立于主包运行，那如果独立分包的页面使用Taro3.x开发是否可行。

结论：

框架升级非必须，但这个也要结合场景去思考。比如我们有基于Taro开发的移动端组件库，如果不结合场景（业务）去使用，组件就会一直到`git`仓库中躺着，这样没有意义。基于这个前提得出以下结论：

  1. wepy框架没办法平滑迁移到taro框架

  2. 小程序插件存在发布周期的问题，需要先等待插件发布

  3. 小程序新增页面中若存在不需要于原生小程序通信的页面可以考虑h5开发

  4. 考虑页面性能，同时主包空间有盈余的前提下可以考虑跨框架开发如：wepy + taro(或者其他框架)

备注：

一次有意义或者没有意义的探求

avatar
文章
阅读
粉丝