5.查看工具安装结果

工具安装结果如图7-3所示。

图7-3 工具安装结果5.查看工具安装结果

工具安装结果如图7-3所示。

图7-3 工具安装结果Widows开发环境搭建（见图7-4）过程可参考汉得公司开放平台相关网页。

图7-4 Widows开发环境搭建页面截图

三、选配前端服务工程

HZERO每个标准前端服务与后端服务是一一对应的，即采用了微前端的模式。这样做方便使用者自由选配和组合，对于不需要的部分无须选配安装，以减少依赖，降低工程“重量”，在编译运行时更加快速方便。

请使用汉得开发平台的前端选配功能创建前端模板工程。

1.使用“在线选配”功能Widows开发环境搭建（见图7-4）过程可参考汉得公司开放平台相关网页。

图7-4 Widows开发环境搭建页面截图

三、选配前端服务工程

HZERO每个标准前端服务与后端服务是一一对应的，即采用了微前端的模式。这样做方便使用者自由选配和组合，对于不需要的部分无须选配安装，以减少依赖，降低工程“重量”，在编译运行时更加快速方便。

请使用汉得开发平台的前端选配功能创建前端模板工程。

1.使用“在线选配”功能第一次使用“在线选配”功能需登录汉得公司开放平台，进入“开发者”→“在线选配”功能。

这里要注意，该功能只允许已注册用户使用。

2.选择“前端选配”

3.进行“服务选配”

“服务选配”页面如图7-5所示。第一次使用“在线选配”功能需登录汉得公司开放平台，进入“开发者”→“在线选配”功能。

这里要注意，该功能只允许已注册用户使用。

2.选择“前端选配”

3.进行“服务选配”

“服务选配”页面如图7-5所示。图7-5 服务选配页面截图

单击“选择依赖”选项框，在组件选择部分，可直接选择已打包好的产品组件包，或者自行在下方搜索并选择要依赖的前端组件，注意组件版本要跟“HZERO版本”保持一致，即选择 1.5.x 版本的组件，具体如图7-6所示。

图7-6 选择组件页面

确认选配后，单击“下一步”按钮。图7-5 服务选配页面截图

单击“选择依赖”选项框，在组件选择部分，可直接选择已打包好的产品组件包，或者自行在下方搜索并选择要依赖的前端组件，注意组件版本要跟“HZERO版本”保持一致，即选择 1.5.x 版本的组件，具体如图7-6所示。

图7-6 选择组件页面

确认选配后，单击“下一步”按钮。4.完成选配并导出工程文件

选配完成后可选择将工程文件发布到GitLab，这里我们不发布到GitLab，直接导出工程源代码。

四、前端工程二次开发

受限于代码的篇幅的限制，本书中的代码仅展示“订单管理”操作页面的开发过程。如需查看完整功能的全部代码示例，请从如下地址下载：https:// gitee.com/hzero-book/hzero-frot-demo。我们可使用VSCode工具打开前端工程，并阅读hzero-frot/README.md 文件，按步骤执行相关操作。

1.VSCode 插件安装

为了帮助开发者提高平时的编码的效率，汉得开发平台推出了一款 c7 的VSCode 插件：c7-dataset-plugi，此插件可以帮助大家更好地进行编码。我们只需要进入 VSCode 的插件页面，搜索 c7，就可以找到对应的插件，如图7-7和图7-8所示。4.完成选配并导出工程文件

选配完成后可选择将工程文件发布到GitLab，这里我们不发布到GitLab，直接导出工程源代码。

四、前端工程二次开发

受限于代码的篇幅的限制，本书中的代码仅展示“订单管理”操作页面的开发过程。如需查看完整功能的全部代码示例，请从如下地址下载：https:// gitee.com/hzero-book/hzero-frot-demo。我们可使用VSCode工具打开前端工程，并阅读hzero-frot/README.md 文件，按步骤执行相关操作。

1.VSCode 插件安装

为了帮助开发者提高平时的编码的效率，汉得开发平台推出了一款 c7 的VSCode 插件：c7-dataset-plugi，此插件可以帮助大家更好地进行编码。我们只需要进入 VSCode 的插件页面，搜索 c7，就可以找到对应的插件，如图7-7和图7-8所示。