共计 3081 个字符，预计需要花费 8 分钟才能阅读完成。
这是 Jerry 2021 年的第 29 篇文章，也是汪子熙公众号总共第 300 篇原创文章。
之前 Jerry 的两篇文章，别离介绍了如何在本地应用 Visual Studio Code 创立一个 SAP Fiori Elements 利用，以及应用 Fiori Elements Controller Extension 理念，对该 Fiori Elements 利用进行二次开发的具体步骤。
- 在没有任何前端开发教训的根底上, 创立第一个 SAP Fiori Elements 利用
- 答网友发问：应用 SAP Fiori Tools 创立的 Fiori Elements 利用，如何进行二次开发？
本地开发实现之后，新的问题牵强附会就来了：如何将该本地利用，部署到近程的 ABAP 服务器上？
如果是在以前的 SAP Cloud Platform (当初改名叫 SAP Business Technology Platform) Neo 环境提供的 Full Stack WebIDE 里开发 SAP Fiori Elements 利用，那么间接应用 SAP WebIDE 里的右键菜单，抉择 “Deploy to SAPUI5 ABAP Repository” 即可实现部署。
而通过 Visual Studio Code 进行 SAP Fiori Elements 利用的本地开发，右键菜单里并没有部署相干的选项：
不过，咱们仔细观察我的项目工程文件夹里的 package.json，还是发现了一些对于部署的线索。在该文件的 scripts 标签里，蕴含 deploy 和 deploy-config 两个指令。
先执行 npm run deploy 命令，这条命令的内容是 fiori verify，即进行部署前的校验工作。校验的后果，在本地检测不到部署配置信息，这样 Visual Studio Code 里装置的 SAP Fiori tools, 基本不晓得开发人员冀望将该利用，部署到哪个 ABAP 服务器上。
因而依照上图橙色的提示信息，运行下列命令行，生成部署配置信息。
npm run deploy-config
如果遇到下列谬误音讯：
Yeoman is not installed or available in your executable path. Please check your configuration or use npm/yarn to install it globally.
阐明 Yeoman 没有装置，应用 npm install –global yo 进行装置即可。
之后从新运行命令行：
npm run deploy-config
首先抉择部署指标类型为 ABAP 服务器。
接下来，须要指定待部署到的 ABAP 服务器的 url，client ID，部署到服务器上生成的 BSP 利用名称，寄存该利用的 ABAP 开发包名称等信息。
咱们在这个命令行向导里输出的内容，会保护到一个名为 ui5-deploy.yaml 的配置文件里。因而，此处咱们能够一路回车，待完结向导后，在 Visual Studio Code 里持续编辑 ui5-deploy.yaml 即可。
npm run deploy-config 命令执行结束后，生成了对应蕴含部署明细信息的 ui5-deploy.yaml 文件，同时 package.json 文件里，deploy 命令的内容，也从之前的 fiori verify，主动替换成了如下内容：
下图是我批改过的 ui5-deploy.yaml 文件。整个文件由 SAP Fiori tools 主动生成，咱们只须要批改图中 1～3 区域的内容。
- 部署 ABAP 服务器的主机名和端口号，以及 client ID. 我部署的 ABAP 服务器为 ER9/001，采纳 basic Authentication 形式认证。
- credentials 区域，保护我登录 ER9/001 的用户名和明码。因为该 yaml 文件须要上传到 Github 上进行版本治理，故不应间接保护用户名和明码等敏感信息，而是将这些信息保护到一个叫做 .env 的文件里，而后在 ui5-deploy.yaml 里援用该 .env 文件。
- 部署到 ABAP 服务器上生成 BSP 利用的名称，以及用来存储该 BSP 利用的 ABAP 开发包名称。
所有就绪之后，执行命令行：
npm run deploy
我第一次试图部署时，遇到了下图的谬误音讯：
Invalid URL: /sap/opu/odata/UI5/ABAP_REPOSITORY_SRV
把该谬误音讯粘贴到 Google 里，很快找到了谬误起因。
SAP 开发了一个规范的 OData 服务 /UI5/ABAP_REPOSITORY_SRV, 可能将本地 SAP UI5 利用打成的 zip 压缩包上传到 ABAP 服务器，并生成对应的 BSP 利用。
对于该 OData 服务的更多阐明，请参阅 SAP 帮忙文档：
https://sapui5.hana.ondemand….
SAP note 2999557 提供了激活该 OData 服务的步骤：
执行事务码 /IWFND/MAINT_SERVICE, 将 /UI5/ABAP_REPOSITORY_SRV 增加到服务列表中。
留神，该 OData 服务仅在 SAP_UI 753 及其以上的版本才可用。
对于 SAP_UI 753 以下的版本，能够尝试应用报表 /UI5/UI5_REPOSITORY_LOAD 手动上传。
npm run deploy 命令执行胜利后，命令行会打印出部署到 ABAP 服务器上的 SAP Fiori Elements 利用可供拜访的 url：
粘贴到浏览器后即可拜访这个运行在 ABAP 服务器上的 SAP Fiori Elements 利用了：
在 ABAP 服务器 ER9/001 上生成的 BSP 利用如下图所示：
至于如何将该 Fiori Elements 利用配置成 ABAP 服务器上 Fiori Launchpad 的一个 tile，这是另外一个话题了。咱们后续持续分享。
感激浏览。
更多浏览
- SAP Fiori 利用索引大全
- Fiori Fundamentals 和 SAP UI5 Web Components
- 为什么 SAP GUI 里的传统事务码能通过 Fiori Launchpad 启动并运行在浏览器里
- 一步步把 SAP GUI 的事务码配置到 SAP Fiori Launchpad 里
- SAP UI5 利用开发人员理解 UI5 框架代码的意义
- SAP UI5 module 懒加载机制
- SAP UI5 控件渲染机制
- HTML 原生事件 VS SAP UI5 Semantic 事件
- SAP UI5 控件元数据的元数据实现
- SAP UI5 控件的实例数据批改和读取逻辑
- SAP UI5 控件数据绑定的实现原理
- SAP UI5 控件数据绑定的三种模式：One Way, Two Way 和 OneTime 实现原理比拟
- SAP UI5 OData 流言粉碎机：极短时间内发送两个 Odata request, 前一个会主动被 cancel 掉吗
- SAP UI5 和 Angular 的函数防抖 (Debounce) 和函数节流 (Throttle) 实现原理介绍
- SAP UI 渲染模式：客户端渲染 VS 服务器端渲染
- SAP UI 的加载动画成果和幽灵设计(Ghost Design)
- 介绍一个能开发简略 SAP UI5 利用的在线 IDE：StackBlitz
- SAP CRM Fiori 利用和 SAP Commerce Cloud (电商云) UI 如何通过调整 CSS 来扭转 UI 显示格调
- SAP 产品一脉相承的 UI 加强思路，在 SAP Commerce Cloud(电商云) UI 加强实现中的体现
- 如何分辨 SAP Fiori Launchpad 里的虚实 Fiori 利用
- 在没有任何前端开发教训的根底上, 创立第一个 SAP Fiori Elements 利用
- SAP Fiori 利用里图标 (Icon) 的渲染原理和应用技巧
- 答网友发问：应用 SAP Fiori Tools 创立的 Fiori Elements 利用，如何进行二次开发？
更多 Jerry 的原创文章，尽在：” 汪子熙 ”:
