【避坑总结】提交一个ohos npm仓踩坑记录
【避坑总结】提交一个ohos npm仓踩坑记录1. HarmonyOS/OpenHarmony npm包(what)npm包是提供给开发者解决相对问题的三方依赖文件,而HarmonyOS/OpenHarmony npm包是针对HarmonyOS/OpenHarmony开发提供的三方依赖文件。
2. 提交npm仓原因(why)开发多个HarmonyOS/OpenHarmony 应用程序时,对于打印日志、字符串处理、数据请求、ICON图标进行二次封装后,每新增一个项目都要将这些文件拷贝到相应的项目下才能够使用,为了易于维护,减少代码量,一处改动所有项目适配(“懒”是程序优化推动的源动力),特此淌了一下HarmonyOS/OpenHarmony npm仓提交的坑。
3. npm中央仓提交大法(how)HarmonyOS/OpenHarmony npm包可以发布到npm官方中心仓,也可以发布到DevEco Marketplace提供的HarmonyOS npm专有仓,本节以npm中心仓为主(因为HarmonyOS npm专有仓没有成功,有成功的大佬不吝赐教) 。
[*]npm账号注册(如果有账号则忽略跳过此步骤)
[*]npm注册地址(https://www.npmjs.com/)
[*]设置下载npm包地址
[*]
[*]
npm config set registry https://registry.npmjs.org/1.1.1.(左右移动查看全部内容)
[*]登录(定位到提交仓根目录,启用命令提示符工具)
[*]
[*]
npm login1.1.1.(左右移动查看全部内容)
查看是否当前登录用户
[*]
[*]
npm whoami1.1.1.(左右移动查看全部内容)
[*]配置package.json
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
{"name": "@tetcl/tetclui", // 包名称,全平台唯一"version": "1.0.0",// 包的版本号"description": "一个HarmonyOS/OpenHarmony App UI库", // 包的功能描述"ohos": { "org": "tetcl"},"author": {// 作者 "name": "bxming", "email": "649579772@qq.com"},"license": "ISC",// 包遵循的开源协议"types": "","devDependencies": {},"main": "index.ets",// 包默认执行的入口文件"repository": {},"dependencies": {}}1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.16.17.18.1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.16.17.18.1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.16.17.18.(左右移动查看全部内容)
在根目录下创建README.md(说明文件)、CHANGELOG.md(版本介绍文件)、LICENSE(许可证)
使用命令进行发布
[*]
[*]
npm publish1.1.1.(左右移动查看全部内容)
当包名为@xxx/xxx时,npm publish默认发布为私有仓,私有仓是需要付费的,所以需要按照以下命令进行发布
[*]
[*]
npm publish --access public1.1.1.(左右移动查看全部内容)
查找发布的npm包打开npm官网输入包名称@tetcl/tetclui进行搜索
在项目中引入,打开entry/package.json添加依赖
[*]
[*]
[*]
[*]
[*]
[*]
{"dependencies": { "@tetcl/tetclui": "^1.0.0"}}1.2.3.4.5.1.2.3.4.5.1.2.3.4.5.(左右移动查看全部内容)
然后点击编辑器顶部Sync Now进行同步。
同步完成后会在entry模块下出现node_modules文件夹,其中就有我们发布的npm包源码。
在entry ---> pages/index.ets文件中引入TeHttp,因为TeHttp是泛型,所以先定义一个接口返回结果处理类。
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
[*]
import {TeHttp, TeLog} from '@tetcl/tetclui'import {RestfulApi} from '../common/RestfulApi'const TAG = "Index"@Entry@Componentstruct Index {@State message: string = 'Hello World'
build() { Flex({alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center}) { Button(this.message, {type: ButtonType.Normal}) .width('100%').height(64) .onClick(() => { TeLog.printInfo(TAG, "***************************")
new TeHttp<RestfulApi>().get('https://api.apiopen.top/api/sentences').then((res) => { TeLog.printInfo(TAG, JSON.stringify(res)) let result: RestfulApi = res; this.message = result.result.name }) }) } .width('100%').height('100%')}}1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.16.17.18.19.20.21.22.23.24.25.1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.16.17.18.19.20.21.22.23.24.25.1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.16.17.18.19.20.21.22.23.24.25.(左右移动查看全部内容)
运行程序查看效果
页:
[1]