鸿蒙应用开发-我的第一个三方库

前言

  1. 鸿蒙应用使用ArkTS进行开发,ArtTS是基于TS进行扩展,添加一些类型限制,TS只是给JS添加了静态类型系统,最终编译完成的JS其实是把类型去掉了的
  2. 前端JS发展这么多年积累了很多非常好用的工具库,把这些工具库迁移到鸿蒙中会给我们开发带来很大的助力
  3. 鸿蒙三方库都是Har包,JS的工具库不能简单的迁移过来,需要做一些改动

准备工作

  1. 我们首先需要有一个鸿蒙三方库的账号,如果没有,进入这个地址进行注册 ohpm.openharmony.cn/#/cn/home
  2. 配置好访问三方库的公钥地址在这 ohpm.openharmony.cn/#/cn/person...
  3. 在个人中心添加你的公钥和获取发布码用于发布三方库到库中心

4. 在用户目录 ~/.ohpm/.ohpmrc里面配置好发布码和私钥路径

开发

说明

我的第一个库是基于 github.com/niksy/throt... v5.0.0版本 进行封装和完善的

js-e2e扫描三方库

鸿蒙是基于OpenHarmony开发的,框架中的API没有完全兼容V8运行时的内置API,我们需要使用js-e2e扫描三方库,检查是否存在node.js/web内置模块的依赖。

js-e2e工具是基于eslint进行封装,可分析出JS库代码对node.js/web浏览器的内置模块、对象的依赖及兼容ES标准版本,使用该工具,可以快速知道该库是否依赖node.js/web内置模块

步骤

下载库 git clone <git@gitee.com>:chenwenjiehw/js-e2e.git

进入下载仓库,安装依赖

执行 npm run mklink 安装输出文档的格式

执行 node checker.js -p throttle-debounce 检查npm包

创建Har包

创建一个空Ability的工程

在工程目录右键 新建→ 模块 或者 点击菜单栏文件 新建→ 模块,选择Static Library

将新建模块 src/main/ets/components删除,并且把Index.ets文件中的代码一并删除

将debounce和throttle代码拷贝到 src/main/ets目录下,当然如果你也可以自己定义一个lib目录,将代码拷贝进去

修改Index.ets代码,将必要的文件导出

在oh-package.json5中完善三方库信息,如名称、简介、版本、开源协议、作者、关键字等

在模块根目录添加CHANGELOG.md 版本变更记录、README.md 简介,安装方式等、LICENSE、example样例 等必要文件

将工程的构建模式修改为release

在工程目录中选中三方库名称,单击菜单栏中的Build > Make Module 'library'编译构建生成三方库HAR包,HAR包可在模块下的build目录下获取,包格式为*.har

验证功能

打开entry/oh-package.json5配置文件,在dependencies标签中引入@unravel/throttle-debounce三方库,并单击Sync Now进行同步 或者 打开终端执行 ohpm install命令

打开pages/Index.ets页面文件,引入并调用debounce和throttle方法进行限频

发布

打开菜单 视图->工具窗口→终端 打开终端应用

在终端 输入 ohpm publish har包的路径,发布到三方库

打开鸿蒙三方库中心仓的地址,切换到package。上面有审核状态等,后续关注信息就可以了 ohpm.openharmony.cn/#/cn/person...

搜索使用

打开三方库中心库 地址 ohpm.openharmony.cn/#/cn/home

在搜索框中输入我们发布成功的库 throttle_debounce就可以看到结果了

点击进去之后,可以查看具体的使用方式说明

参考资料

  1. JS开源库适配纯血鸿蒙 mp.weixin.qq.com/s/9qZWN6Y_R...
  2. 鸿蒙三方库中心仓 ohpm.openharmony.cn/#/cn/home
  3. 创建及发布三方库 ohpm.openharmony.cn/#/cn/help/c...
相关推荐
sinat_384241095 小时前
HarmonyOS音乐播放器开发实战:从零到一打造完整鸿蒙系统音乐播放器应用 2
华为·gitlab·intellij-idea·harmonyos·visual studio·webstorm
waeng_luo7 小时前
HarmonyOS开发-多线程与异步编程
harmonyos·鸿蒙2025领航者闯关·鸿蒙6实战·#鸿蒙2025领航者闯关
花开彼岸天~8 小时前
鸿蒙平台使用 `video_thumbnail` 插件指南
华为·harmonyos
特立独行的猫a8 小时前
QT开发鸿蒙PC应用:环境搭建及第一个HelloWorld
开发语言·qt·harmonyos·环境搭建·鸿蒙pc
花开彼岸天~8 小时前
Flutter跨平台开发鸿蒙化定位组件使用指南
flutter·华为·harmonyos
sinat_384241099 小时前
HarmonyOS音乐播放器开发实战:从零到一打造完整鸿蒙系统音乐播放器应用 1
华为·harmonyos
个案命题11 小时前
鸿蒙ArkUI状态管理新宠:@Once装饰器全方位解析与实战
华为·harmonyos
云_杰11 小时前
取件伙伴性能提升——长列表
性能优化·harmonyos
花开彼岸天~12 小时前
Flutter跨平台开发鸿蒙化日志测试组件使用指南
flutter·elasticsearch·harmonyos
妮妮分享12 小时前
Harmony NEXT 定位 SDK:开启鸿蒙原生应用精准定位新时代
华为·harmonyos