鸿蒙 UTS 插件使用三方依赖
在鸿蒙开发中市场需要使用三方依赖,可能是三方包,可能是一个本地 har 包,这里介绍如何接入。
接入三方依赖
这里举例 https://ohpm.openharmony.cn/ 最受欢迎的三方库 @pura/harmony-utils
。这个库,提供了众多方法,可以加速功能开发。
更新:为了辅助说明,这里提供了 uts 源码,可对比参考 https://ext.dcloud.net.cn/plugin?id=24849
harmony-utils 一款功能丰富且极易上手的HarmonyOS工具库,借助众多实用工具类,致力于助力开发者迅速构建鸿蒙应用。其封装的工具涵盖了APP、设备、屏幕、授权、通知、线程间通信、弹框、吐司、生物认证、用户首选项、拍照、相册、扫码、文件、日志,异常捕获、字符、字符串、数字、集合、日期、随机、base64、加密、解密、JSON等一系列的功能和操作,能够满足各种不同的开发需求。
从原生鸿蒙角度开发,使用这个工具库,需要两个步骤
- 安装依赖
- 调用方法
在 UTS 中使用这个工具库,需要三个步骤
- 创建 UTS 插件
- 引用依赖
- 调用方法
下面介绍具体步骤
假设我们希望通过 harmony-utils 获取当前的工具包名。调用的是 AppUtil.getBundleName
1. 创建 UTS 插件
在 HBuilderX 中操作。首先创建 uni_modules
功能,如果当前目录中没有对应文件夹,可在项目文件夹节点单击右键选择 新建 uni_modules 目录
这会创建 uni_moduels
文件夹,在这个文件夹上单击右键。
在新窗口中选择 UTS 插件-API 插件,点击创建。
假定插件的 ID 是 invoke-utils
,找到这个文件夹,观察是否存在对应的文件,如果没有就创建 uni_modules/invoke-utils/utssdk/app-harmony/index.uts
。
这样插件就创建好了。这部分可参考 UTS 插件介绍 和 原生混编 做进一步了解。
2. 安装依赖
创建 uni_modules/invoke-utils/utssdk/app-harmony/config.json
,添加依赖。可参考文档 配置uts插件依赖。
鸿蒙的库管理工具是ohpm。类似于js的npm,Android的仓储。鸿蒙的三方sdk封装文件为
.har
,类似于Android的.aar
uts插件的utssdk/app-harmony/config.json
文件内可以配置依赖使用鸿蒙的三方库
代码填写下面方案:
{
"dependencies": {
"@pura/harmony-utils":"1.3.6"
}
}
接下来准备使用依赖功能。
3. 调用方法
在 index.uts 中添加下面逻辑
import { AppUtil } from '@pura/harmony-utils'
UTSHarmony.onAppAbilityCreate(() => {
const abilityCtx = UTSHarmony.getUIAbilityContext();
const ctx = abilityCtx
AppUtil.init(ctx);
})
export const getAppId = () => {
let bundleName = AppUtil.getBundleName();
return bundleName
}
在原始文档中要求在 AbilityCreate 中初始化,这里可以使用 UTSHarmony.onAppAbilityCreate
来实现初始化。
和 TS 代码类似,调用了提供的方法,返回了具体数据。
在实际的 Vue 逻辑中,比如 button 通过 click 调用下面逻辑即可
<script setup>
import { getAppId } from '@/uni_modules/invoke-utils'
function openTest() {
const res = getAppId()
console.log('获取应用ID:', res)
}
</script>
调用此方法,观察控制台,可以看到包名。这说明工具调用成功。
接入 har 依赖
接入 har 依赖。如何制作 har 依赖,在下面单独说明。
假定已经得到了一个 localLib.har
文件。放置 har 文件在 uts 插件内,比如在 index.uts 的同级目录, libs/localLib.har
路径。
修改 config.json,配置相对路径。
{
"dependencies": {
"locallib": "./libs/localLib.har"
}
}
在 index.uts 中引用和导出。
import { add } from 'locallib'
export const addFun = (a:number, b:number):number => {
return add(a, b)
}
在页面中引入这个 uts 插件并使用即可。
<script setup>
import { addFun} from '@/uni_modules/otto-thirdhar'
function openTest() {
console.log(addFun(3,4))
}
</script>
执行这个方法,顺利的话可以看到控制台打印数字 7.
注意事项:
- 引入 har 可能有版本兼容性要求,可在
harmony-configs/build-profile.json5
内修改compatibleSdkVersion
- har 可能构建内容有误,实际运行不正常,可在原生工程项目中自测,排除 har 文件内部问题
如何构建 har 模块
在 DevEco 中打开一个项目,选择 文件 - 新建 - 模块 - Static Library,定义模块名选择创建。
在创建的文件中选择 index.ets
找到模块入口,可导出组件、方法。
在 DevEco 中选择 构建(在重构和运行中间) - 构建模块(第一个选项),等待编译结束,观察模块目录中的 build/default/outputs/default
找到 har 文件。
har 文件本身是一个压缩文件,可自行拆包了解结构,内部存在方法 d.ets
等文件。
4 个评论
要回复文章请先登录或注册
DCloud_UNI_OttoJi (作者)
l***@moyuan.cc
DCloud_UNI_OttoJi (作者)
赢无翳