3.2.2快速上手

快速上手

本小节将为您介绍在构建VPA卡片(组件)所需要的开发环境。

1、前置提示

推荐,但非必须

推荐使用 volta 管理 node 版本,在开发机器上安装 volta 后,volta 会自动识别 package.json 中的 node 版本,并安装。

在往后的开发中,当使用 node 或者 npm 命令时,volta 会自动切换到项目中指定的 node 版本。

方便开发者在不同项目中使用不同版本的 node。

volta 安装方法参考:https://docs.volta.sh/guide/getting-started

2、开发环境设置

2.1 检出代码

git clone https://git.yonyou.com/YangYongAn/vpa-h5.git

2.2 安装依赖和启动服务

由于包内某些组件依赖于 YNPM 物料库,因此包管理工具请使用 YNPM 。如果没有安装 YNPM,请先安装 YNPM 。

ynpm install

稍等片刻,安装完成后,启动服务:

ynpm run start

3、设置配置信息

👍🏻 推荐使用【开发助手】自动设置

环境准备:

  1. 开发机器和手机在同一个局域网中
  2. 开发机器上安装了友空间 APP

项目如果正常启动,会在浏览器中打开一个页面,页面中会有一个配置信息的二维码,需要使用友空间 APP, 扫码打开开发助手页面,然后在开发助手页面中,按照页面提示设置配置信息。

相关原理:扫码会从友空间获取必要的会话信息,主要是 host 和 yhtAccessToken ,然后将这些信息伴随一个配置文件名,发送到开发机器上。 开发机器接收到信息后,会去项目根目录的 .config 目录下写入相关配置,并且会更改 .env.local 的 process.env 中的相关配置信息。

🍉 如果不方便扫码或者没有局域网,可以参考【本地开发配置】手动设置配置信息

4、重启服务

配置信息设置完成后,需要重启服务,才能生效。

ynpm run start

如果一切顺利,项目会正常启动,并且能够在欢迎页面看到相关欢迎语,说明已经成功进入开发环境。

接下来,就可以开始开发了。

是否仍需要帮助? 请保持联络!
最后更新于 2024/10/21