当前位置: 首页 > news >正文

SAP UI5 walkthrough step2 Bootstrap

我的理解,这就是一个引导指令

1.我们右键打开命令行--执行  ui5 use OpenUI5

2.执行命令:ui5 add sap.ui.core sap.m themelib_sap_horizon

执行完之后,会更新 yaml 文件

3.修改index.html 

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>UI5 Walkthrough</title><scriptid="sap-ui-bootstrap"src="resources/sap-ui-core.js"data-sap-ui-theme="sap_horizon"data-sap-ui-libs="sap.m"data-sap-ui-compatVersion="edge"data-sap-ui-async="true"data-sap-ui-onInit="module:ui5/walkthrough/index"data-sap-ui-resourceroots='{"ui5.walkthrough": "./"}'></script>
</head>
<body>
<div>Hello World</div>
</body>
</html>

In this step, we load the SAPUI5 framework from the webserver provided by UI5 Tooling and initialize the core modules with the following configuration options:

  • The id attribute of the <script> tag has to be exactly "sap-ui-bootstrap" to ensure proper booting of the SAPUI5 runtime.
  • The src attribute of the <script> tag tells the browser where to find the SAPUI5 core library – it initializes the SAPUI5 runtime and loads additional resources, such as the libraries specified in the data-sap-ui-libs attribute.

  • The SAPUI5 controls support different themes. We choose sap_horizon as our default theme.

  • We specify the required UI library sap.m, which contains the UI controls we need for this tutorial.

  • To make use of the most recent functionality of SAPUI5 we define the compatibility version as edge.

  • We configure the bootstrapping process to run asynchronously. This means that the SAPUI5 resources can be loaded simultaneously in the background for performance reasons.

  • We define the module to be loaded initially in a declarative way. With this, we avoid directly executable JavaScript code in the HTML file. This makes your app more secure. We'll create the script that this refers to further down in this step.
  • We tell SAPUI5 core that resources in the ui5.walkthrough namespace are located in the same folder as index.html.

注意 这里src 的输入值是resources/sap-ui-core.js

我们需要先将resources文件先建立,并从从”https://openui5.hana.ondemand.com/resources/sap-ui-core.js“中将此文件保存进去

或者直接将src 的输入值改为 https://openui5.hana.ondemand.com/resources/sap-ui-core.js

这样之后才能正常加载

4.在webapp文件下创建一个index.js的文件

sap.ui.define([], () => {"use strict";alert("UI5 is ready");
});

5.输入npm start  结果如下

http://www.lryc.cn/news/255192.html

相关文章:

  • Gemini:定义下一代人工智能的里程碑
  • 一些系统日常运维命令和语句
  • 微信小程序uni.chooseImage()无效解决方案
  • Rust深入浅出:编程的深邃大海中的奇妙冒险
  • go-zero开发入门-API网关开发示例
  • TCP一对一通信
  • laravel DB::connection 报错 Database connection [{$name}] not configured
  • 快捷支付是什么?快捷支付好申请吗?
  • 如何在Spring Boot中集成RabbitMQ
  • 【Spring Boot 源码学习】ApplicationContextInitializer 详解
  • 软考2018下午第六题改编逻辑(状态模式)
  • 基于深度学习的典型目标跟踪算法
  • docker搭建nginx实现负载均衡
  • Android蓝牙协议栈fluoride(二) - 软件框架
  • IDEA中的Postman!
  • el-tooltip (element-plus)修改长度
  • Verilog学习 | 用initial语句写出固定的波形
  • 使用arcpy移除遥感影像云层
  • 编程应用实例,商超进销存管理系统软件,支持扫描条形码也可以自编码
  • 第二证券:十字星买入法?
  • 【C++】如何优雅地把二维数组初始化为0
  • 8 个顶级的 PDF 转 Word 转换器
  • 计算机网络——习题
  • Linux 线程——信号量
  • 网页设计中增强现实的兴起
  • Android7.0新特性
  • visual studio 2022中使用vcpkg包管理器
  • C语言-链表_基础
  • Java第二十一章总结
  • 【keil备忘录】2. stm32 keil仿真时的时间测量功能