鸿蒙开发 - ohpm安装第三方库

发布时间:2023年12月17日

前端开发难免使用第三方库,鸿蒙亦是如此,在使用 DevEco Studio 开发工具时,如何引入第三方库呢?操作步骤如下,假设你使用的是MacOS,假设你已经创建了了一个项目:

一、配置 HTTP Proxy

在打开了工程的情况下,点击左上角 DevEco Studio -> Preferences -> Appearance & Behavior -> System Settings -> HTTP Proxy

进入HTTP Proxy设置界面,如下图:
在这里插入图片描述
HTTP Proxy配置中,我们不需要设置代理,所以直接勾选 No proxy

二、配置NPM代理

在打开了工程的情况下,可以单击 DevEco Studio -> Preferences -> Build, Execution, Deployment -> Node.js and npm -> Optimize config

在这里插入图片描述
具体配置如下:

1.npm registry:配置npm仓的地址信息。

https://repo.huaweicloud.com/repository/npm/

2.ohos registry:HarmonyOS npm三方包共享仓。

https://repo.harmonyos.com/npm/

这里我们也不需要设置 HTTP proxy信息。

填写并勾选以上信息后,点击OK。在此界面配置的代理信息将写入 .npmrc文件中,文件路径 /Users/sunshiyu/.npmrc 。因此也可直接修改.npmrc文件进行配置。

在这里插入图片描述

Node配置环境变量:

export NODE_HOME= /usr/local/bin #本处路径请替换为Node的安装路径
export PATH=${NODE_HOME}/bin:${PATH}

三、配置OHPM代理

在打开了工程的情况下,可以单击 DevEco Studio -> Preferences -> Build, Execution, Deployment -> Ohpm -> Optimize Config

在这里插入图片描述

具体配置如下:

1.ohpm registry:配置ohpm仓的地址信息。

https://repo.harmonyos.com/ohpm/

这里我们也不需要配置 HTTP proxy信息。填写并勾选以上信息后,点击OK。

在此界面配置的代理信息将写入.ohpmrc文件中,路径 /Users/sunshiyu/.ohpm/.ohpmrc 。因此也可直接修改 .ohpmrc 文件进行配置。

在这里插入图片描述

ohpm配置环境变量中。

export OHPM_HOME=/Users/sunshiyu/Library/Huawei/ohpm  #本处路径请替换为ohpm的安装路径
export PATH=${OHPM_HOME}/bin:${PATH}

四、安装三方库

以上三步理论上在安装DevEco的时候就已经配置好的,如果有同学需要配置HTTP proxy,请参考官方文档:配置开发环境 。我们来安装一个三方库试试,打开项目中的终端:

安装 lottie

ohpm info @ohos/lottie

在这里插入图片描述

再安装一个List组件的下拉加载库: PullToRefresh

ohpm install @ohos/pulltorefresh

在这里插入图片描述

其实安装的速度还是很快的。

查看项目中安装的三方库:

 ohpm list

在这里插入图片描述

项目中三方库位置如下:

在这里插入图片描述

文章来源:https://blog.csdn.net/SSY_1992/article/details/134959912
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。