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

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

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

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

在打开了工程的情况下，可以单击 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}

在打开了工程的情况下，可以单击 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

在这里插入图片描述

项目中三方库位置如下：

在这里插入图片描述