评论

uniapp 小程序转donut多端跑不起来的解决大法

uniapp 小程序转donut多端跑不起来的解决大法

看到微信官方推出的小程序 donut 多端框架,找个了uniapp demo想去体验一下,想看下能不能直接转,转出来的效果性能如何之类的。好家伙,没想到,竟然跑都跑不起来。。。

话不多说,直接图,白屏,根本跑不起来

我只是用了一个简单的demo,且小程序模式我的项目运行得很正常,所以不是我的代码问题。

但,一切换到多端项目就直接白屏,并且报错  。一脸蒙圈。。。

更奇怪的是,我并没有使用  的相关接口。。。。这瞬间就引起了我的好奇心。

看下报错堆栈,发现出错的地方是 uniapp 框架的 vendor.js 的下面的内容。 uniapp 会判断运行的 env 环境如果为 SAAASDK (小程序多端模式的时候 env 就是这个值,详情可参考小程序多端框架接口wx.getSystemInfo文档),则使用 wx.miniapp.shareVideoMessage 。否则是小程序的 wx.shareVideoMessage

难道 . 在小程序多端模式场景,微信小程序基础库没有具体实现,所以是 undefined 的?跑去看了下微信小程序官方文档,发现是有对应的接口  吖?那,为啥会有问题呢???

于是进一步测试,试了下新建的普通小程序项目转成多端应用模式的时候,发现 wx.miniapp 这些接口都是正常的。

只有在使用了 uniapp 框架的项目,去console运行的的时候 wx.miniapp 出现的是 undefined

于是我继续去看了下 uniapp 官方的代码,原来 uniapp 会去初始化小程序基础库的 wx 对象(代码位置)。只放出对应的 key 属性。然而由于这里并没有允许 miniapp 这个 key。所以导致 wx.miniapp 就没有初始化进来。

这样整个问题就清楚了。问题原因应该就是:

  1. uniapp 初始化的时候会判断环境是否是 SAAASDK, 是的话则使用 wx.miniapp.shareVideoMessage
  2. 然而 uniapp 初始化小程序基础库的 wx 对象,但并没有放开 miniapp 这个属性,导致访问不到,就出现报错了

解决办法

因为 uniapp 官方到现在并没有处理这个问题,估计不是他们的业务场景。这里只能我自己手动解决了。

在生成的 vendor.js 的我搜索下 objectKeys,然后加入了 miniapp 的属性 key 值,确保 initWx 的时候能够 保证 wx.miniapp 能够正常使用。

最终重新编译了下,能够正常运行,十分完美!

并且 wx.miniapp也可以运行了

但整个过程太折腾了太麻烦了呀,不知道后续这个问题 uniapp 官方会不会解决或者出其他解决方案。

最后,还有个有意思的地方是,我去问了微信官方人员,他们反馈说这个 shareVideoMessage 接口是在今年 03 月底实现的。然后我去因为看了下 uniapp 官方代码提交,找到了具体的 commit 。发现这个使用 wx.miniapp.shareVideoMessage 的 commit 提交时间是 1月多的时候,竟然比微信官方还提前了两个月多。。。。

此外,既然使用了这个wx.miniapp.shareVideoMessage 方法,为啥不适配多几个多端的接口?以及为啥不放出 wx.miniapp 这个属性,这里的原因就不得而知了。。希望有 uniapp 框架的大佬帮忙解答下咯。

最后一次编辑于  刚刚  

看到微信官方推出的小程序 donut 多端框架,找个了uniapp demo想去体验一下,想看下能不能直接转,转出来的效果性能如何之类的。好家伙,没想到,竟然跑都跑不起来。。。

话不多说,直接图,白屏,根本跑不起来

我只是用了一个简单的demo,且小程序模式我的项目运行得很正常,所以不是我的代码问题。

但,一切换到多端项目就直接白屏,并且报错  。一脸蒙圈。。。

更奇怪的是,我并没有使用  的相关接口。。。。这瞬间就引起了我的好奇心。

看下报错堆栈,发现出错的地方是 uniapp 框架的 vendor.js 的下面的内容。 uniapp 会判断运行的 env 环境如果为 SAAASDK (小程序多端模式的时候 env 就是这个值,详情可参考小程序多端框架接口wx.getSystemInfo文档),则使用 wx.miniapp.shareVideoMessage 。否则是小程序的 wx.shareVideoMessage

难道 . 在小程序多端模式场景,微信小程序基础库没有具体实现,所以是 undefined 的?跑去看了下微信小程序官方文档,发现是有对应的接口  吖?那,为啥会有问题呢???

于是进一步测试,试了下新建的普通小程序项目转成多端应用模式的时候,发现 wx.miniapp 这些接口都是正常的。

只有在使用了 uniapp 框架的项目,去console运行的的时候 wx.miniapp 出现的是 undefined

于是我继续去看了下 uniapp 官方的代码,原来 uniapp 会去初始化小程序基础库的 wx 对象(代码位置)。只放出对应的 key 属性。然而由于这里并没有允许 miniapp 这个 key。所以导致 wx.miniapp 就没有初始化进来。

这样整个问题就清楚了。问题原因应该就是:

  1. uniapp 初始化的时候会判断环境是否是 SAAASDK, 是的话则使用 wx.miniapp.shareVideoMessage
  2. 然而 uniapp 初始化小程序基础库的 wx 对象,但并没有放开 miniapp 这个属性,导致访问不到,就出现报错了

解决办法

因为 uniapp 官方到现在并没有处理这个问题,估计不是他们的业务场景。这里只能我自己手动解决了。

在生成的 vendor.js 的我搜索下 objectKeys,然后加入了 miniapp 的属性 key 值,确保 initWx 的时候能够 保证 wx.miniapp 能够正常使用。

最终重新编译了下,能够正常运行,十分完美!

并且 wx.miniapp也可以运行了

但整个过程太折腾了太麻烦了呀,不知道后续这个问题 uniapp 官方会不会解决或者出其他解决方案。

最后,还有个有意思的地方是,我去问了微信官方人员,他们反馈说这个 shareVideoMessage 接口是在今年 03 月底实现的。然后我去因为看了下 uniapp 官方代码提交,找到了具体的 commit 。发现这个使用 wx.miniapp.shareVideoMessage 的 commit 提交时间是 1月多的时候,竟然比微信官方还提前了两个月多。。。。

此外,既然使用了这个wx.miniapp.shareVideoMessage 方法,为啥不适配多几个多端的接口?以及为啥不放出 wx.miniapp 这个属性,这里的原因就不得而知了。。希望有 uniapp 框架的大佬帮忙解答下咯。

最后一次编辑于  刚刚  


点赞 1
收藏
评论

2 个评论

  • sunny°
    sunny°
    2023-10-01

    666

    2023-10-01
    赞同
    回复
  • 金钱豹
    金钱豹
    2023-07-26

    业务冲突了。

    2023-07-26
    赞同
    回复
登录 后发表内容