SAP Business Application Studio(BAS)中开发Fiori App的基础知识

2024-03-19 08:28

本文主要是介绍SAP Business Application Studio(BAS)中开发Fiori App的基础知识,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

1. SAP Fiori Tools

SAP Fiori Tools是一套用于支持SAP Fiori应用开发的工具,包括应用模板、可视化编辑器、代码生成、应用预览和集成测试工具等。这些工具可以帮助开发者更快速、更简单地创建和维护SAP Fiori应用。SAP Fiori Tools 可与SAP的开发环境(例如SAP BAS)和部署环境(例如SAP BTP)无缝集成。

SAP Fiori Tools支持了Fiori App的整个开发周期,包括项目生成,本地测试(运行应用、从后台抓取数据、app-to-app的导航测试)以及最终的部署。Fiori Tools也支持VS Code和命令行访问。

对于开发者而言,开发一个连接SAP数据源的Fiori应用程序有两种方式:一种是基于SAP Fiori Element,另一种是SAP Fiori Freestyle。

1.1 SAP Fiori Element

SAP Fiori元素为开发人员提供了一系列的预定义模板,我们可以直接使用标准模板开发应用程序,这样不仅可以提高开发效率,还可以统一用户体验。

使用SAP Fiori元素时,用户前台界面UI的实现是基于OData服务和注释的,不需要JavaScript UI编码。SAP Fiori元素运行时,会解释底层OData服务的元数据和注释,并在启动时为SAP Fiori应用程序自动生成相应的视图。

1.2 SAP Fiori freestyle

SAP Fiori freestyle是开发SAP Fiori应用程序的另一种选择。通过使用SAP Fiori自由式模板,开发人员可以灵活地基于OData服务和JavaScript UI编码创建自定义应用程序。

2. UI5 CLI (命令行界面)

SAPUI5 CLI 是UI5工具套件的一部分, UI5 CLI 提供了一系列的命令工具,这些命令可以帮助开发者更有效地创建和管理SAP UI5项目。在实际开发中,可以使用SAP Fiori Tools来创建和设计应用,然后使用UI5 CLI来构建和部署应用。

SAP UI5 CLI的配置是在ui5.yaml中完成的,额外的配置会存储在例如ui5-local.yaml或ui5-cli.yaml中。

配置文件中的 fiori-tools-proxy : 是指代理到后台系统;fiori-tools-appreload 是指当发生代码改动后自动重新加载。

3. 应用信息

创建或克隆了一个Fiori Element项目时,BAS会自动打开应用信息界面Application Info。在这个界面上可以看到项目的详细信息(项目类型、SAPUI5版本等),状态信息(项目的依赖信息),以及一些建议的action。

可以通过命令面板的 Fiori: Open Application Info 命令打开这个页面。

4. 运行一个Fiori App

运行Fiori App可以通过以下几种方式:

  • 运行配置Run Configuration 
  • 通过UI运行NPM脚本
  • 通过terminal运行NPM脚本
  • 通过terminal直接调用

可以使用Application Info > Preview Application 选项来列出所有的运行选项,然后通过 start* 筛出来运行app的NPM脚本。

5. 运行时配置Run Configurations 

Run Configurations 功能允许你定义和管理应用程序的配置, 这些配置可以包括启动脚本、环境变量、命令行参数等, 它本质上是运行了以下命令:

npx fiori run --open filename.html

创建一个新的配置可以有以下设置:

  1. 配置的名称
  2. 文件名:选择用于启动应用程序的html文件
  3. 模拟数据Mock Data: 使用一个mock server来模式Odata请求服务
  4. 支持助手:检查这个应用程序的构建是否符合构建SAPUI5应用程序的最佳实践
  5. URL 组件:为SAP Fiori Launchapd上基于网络的app间导航(app-to-app)定义额外的URL参数
  6. 高级设置:定义使用的SAPUI5版本或应用使用的目标系统destination

你可以通过点击 "Run" 或 "Debug" 按钮来运行或调试你的应用程序。SAP BAS将使用你定义的运行配置来启动你的应用程序。

相关运行设置是存储在<workspace>/.vscode/launch.json 文件中的,开发人员可以定义多个可运行的配置文件。

6. NPM脚本

NPM (node package manager)是node.js的包管理工具, 用于管理node.js项目以及其依赖关系。Fiori Tools的内核是基于node.js的运行环境的,因而,每一个Fiori项目其实也会被管理成一个npm项目。

每一个Fiori项目其实也会被管理成一个npm项目。

NPM脚本(NPM scripts)是在package.json文件中定义的一组命令,这些命令可以帮助你自动化开发流程中的一些常见任务,如构建、测试、部署等(见下图的scripts)。我们也可以从管理器Explorer中的NPM Scripts View或通过terminal来启动NPM脚本。

以下是使用NPM脚本的一般步骤:

1. 在package.json文件中定义脚本:

在package.json文件的scripts字段中,你可以定义你需要的脚本。例如,你可以定义一个start脚本来启动你的应用,或者定义一个test脚本来运行你的测试。
{
  "name": "my-app",
  "version": "1.0.0",
  "scripts": {
    "start": "node app.js",
    "test": "mocha tests/"
  }
}

2. 运行脚本:

定义好脚本后,你可以通过npm run命令来运行这些脚本。例如,你可以运行npm run start来启动你的应用,或者运行npm run test来运行你的测试。注意,对于start和test这两个特殊的脚本,你也可以直接运行npm start和npm test,而不需要加run。

7. 端口预览(port preview)

在SAP BAS中端口(port)是一个重要的概念, 它是用于网络通信的一个接口,可以被应用程序用来接收或发送数据

在SAP BAS中,每个Dev Space都有一组专用的端口,这些端口可以被Workspace中的应用程序使用。例如,你可以在开发工作空间中启动一个Web服务器,然后通过一个特定的端口来访问这个服务器。

SAP BAS的端口功能有以下几个主要特点:

  • 自动端口转发:当你在工作空间中启动一个服务时,SAP BAS会自动为这个服务分配一个端口,并将这个端口转发到你的本地机器。这意味着你可以在本地浏览器中通过这个端口来访问你的服务。
  • 端口管理:SAP BAS提供了一个端口管理面板,你可以在这个面板中查看和管理你的端口。例如,你可以查看哪些端口正在被使用,或者手动添加新的端口转发。
  • 安全性:为了保证安全,SAP BAS只允许工作空间内的服务访问这些端口

在命令面板中输入Ports: Preview命令,列出所有正在运行的应用程序及其端口。

8. 示例:通过terminal运行Fiori App

Step1: 安装所有的依赖 npm install

Step2: 启动npm脚本,npm run start

Step3: 在不同的SAPUI5版本下运行应用程序

通过不同Run Configurations中的配置,可以选择SAPUI5的版本。

9. 参考资料:

  •  SAP Fiori tools | SAP Help Portal
  •  UI5 CLI - UI5 Tooling (sap.github.io)
  •  SAP Help Portal for BAS

  •  SAP Community for BAS

这篇关于SAP Business Application Studio(BAS)中开发Fiori App的基础知识的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/825379

相关文章

基于Qt开发一个简单的OFD阅读器

《基于Qt开发一个简单的OFD阅读器》这篇文章主要为大家详细介绍了如何使用Qt框架开发一个功能强大且性能优异的OFD阅读器,文中的示例代码讲解详细,有需要的小伙伴可以参考一下... 目录摘要引言一、OFD文件格式解析二、文档结构解析三、页面渲染四、用户交互五、性能优化六、示例代码七、未来发展方向八、结论摘要

React实现原生APP切换效果

《React实现原生APP切换效果》最近需要使用Hybrid的方式开发一个APP,交互和原生APP相似并且需要IM通信,本文给大家介绍了使用React实现原生APP切换效果,文中通过代码示例讲解的非常... 目录背景需求概览技术栈实现步骤根据 react-router-dom 文档配置好路由添加过渡动画使用

在 VSCode 中配置 C++ 开发环境的详细教程

《在VSCode中配置C++开发环境的详细教程》本文详细介绍了如何在VisualStudioCode(VSCode)中配置C++开发环境,包括安装必要的工具、配置编译器、设置调试环境等步骤,通... 目录如何在 VSCode 中配置 C++ 开发环境:详细教程1. 什么是 VSCode?2. 安装 VSCo

C#图表开发之Chart详解

《C#图表开发之Chart详解》C#中的Chart控件用于开发图表功能,具有Series和ChartArea两个重要属性,Series属性是SeriesCollection类型,包含多个Series对... 目录OverviChina编程ewSeries类总结OverviewC#中,开发图表功能的控件是Char

鸿蒙开发搭建flutter适配的开发环境

《鸿蒙开发搭建flutter适配的开发环境》文章详细介绍了在Windows系统上如何创建和运行鸿蒙Flutter项目,包括使用flutterdoctor检测环境、创建项目、编译HAP包以及在真机上运... 目录环境搭建创建运行项目打包项目总结环境搭建1.安装 DevEco Studio NEXT IDE

Python开发围棋游戏的实例代码(实现全部功能)

《Python开发围棋游戏的实例代码(实现全部功能)》围棋是一种古老而复杂的策略棋类游戏,起源于中国,已有超过2500年的历史,本文介绍了如何用Python开发一个简单的围棋游戏,实例代码涵盖了游戏的... 目录1. 围棋游戏概述1.1 游戏规则1.2 游戏设计思路2. 环境准备3. 创建棋盘3.1 棋盘类

这15个Vue指令,让你的项目开发爽到爆

1. V-Hotkey 仓库地址: github.com/Dafrok/v-ho… Demo: 戳这里 https://dafrok.github.io/v-hotkey 安装: npm install --save v-hotkey 这个指令可以给组件绑定一个或多个快捷键。你想要通过按下 Escape 键后隐藏某个组件,按住 Control 和回车键再显示它吗?小菜一碟: <template

Hadoop企业开发案例调优场景

需求 (1)需求:从1G数据中,统计每个单词出现次数。服务器3台,每台配置4G内存,4核CPU,4线程。 (2)需求分析: 1G / 128m = 8个MapTask;1个ReduceTask;1个mrAppMaster 平均每个节点运行10个 / 3台 ≈ 3个任务(4    3    3) HDFS参数调优 (1)修改:hadoop-env.sh export HDFS_NAMENOD

linux-基础知识3

打包和压缩 zip 安装zip软件包 yum -y install zip unzip 压缩打包命令: zip -q -r -d -u 压缩包文件名 目录和文件名列表 -q:不显示命令执行过程-r:递归处理,打包各级子目录和文件-u:把文件增加/替换到压缩包中-d:从压缩包中删除指定的文件 解压:unzip 压缩包名 打包文件 把压缩包从服务器下载到本地 把压缩包上传到服务器(zip

计组基础知识

操作系统的特征 并发共享虚拟异步 操作系统的功能 1、资源分配,资源回收硬件资源 CPU、内存、硬盘、I/O设备。2、为应⽤程序提供服务操作系统将硬件资源的操作封装起来,提供相对统⼀的接⼝(系统调⽤)供开发者调⽤。3、管理应⽤程序即控制进程的⽣命周期:进程开始时的环境配置和资源分配、进程结束后的资源回收、进程调度等。4、操作系统内核的功能(1)进程调度能⼒: 管理进程、线