HBuildX的uniapp项目集成配置APP原生插件

2021-07-02  本文已影响0人  浪人残风

官方文档:https://nativesupport.dcloud.net.cn/NativePlugin/use/use

1.APP原生插件绑定项目AppId

在uniapp的插件市场搜索插件,进入插件详情页面,选择“购买xxx for 云打包”或"试用",
然后在弹框里选择本插件要在哪个项目中使用,勾选后确定。如下绑定的是AppID为__UNI__7709DCF的项目,说明此插件只能在AppID为__UNI__7709DCF的项目里使用。

image.png image.png

2.在HBuildX项目里配置插件

HBuildX里打开绑定了插件的项目,确认AppID是否为刚刚插件绑定的那个。
然后在manifest.json的App原生插件里云端插件里选择插件。

image.png image.png

3.自定义基座运行

原生插件只能通过自定义基础运行来调试或打包。
3.1 制作自定义基座
运行 -》 运行到手机或模拟器 -》 制作自定义调试基座 -》 分别配置好Android和iOS的包名和签名等信息,特别是Android包名和Buildle ID(AppID),这里需要换成自己的项目Android包名和Buildle ID(AppID),很多第三方SDK都需要绑定这两个信息的,比如极光推送
选择传统打包,确定打包,这时会把代码上传到uniapp云平台打包,打包时间可能有点长,留意控制台的输出日志

image.png
image.png
image.png
image.png

3.2 使用自定义基座运行
选择运行时使用自定义基座:
运行 -》 运行到手机或模拟器 -》 运行基座选择 -》 自定义调试基座
选择完自定义调试基座后就可以直接运行了

image.png image.png

常见问题

1. TypeError: this.$refs.videoPlayer.pause is undefine

如果插件是UI控件,是component形式的插件,只能在nvue的页面中使用
如果插件是普通的业务组件,是module形势的插件,可以在vue和nvue页面中使用
简单点说就是vue页面其实就是个vue的h5网页,nvue页面才会使用原生app的控件

如果在vue页面使用了component形式的插件,会找不到这种原生控件的,所有报错
解决方案:
把vue页面改成nvue,删除APP,重新运行,如果还是不行的话就重新制作自定义基座!

上一篇下一篇

猜你喜欢

热点阅读