在按照本文动手尝试之前,请先阅读这篇文章学习 glitch 最基础的用法:web 应用在线编辑器 glitch 简介。
新建一个类型为 glitch-hello-website 应用:
![](https://img.haomeiwen.com/i2085791/dd57f07880d4d82c.png)
此时会生成如下图所示的项目结构。我们只需要 index.html 和 index.js ( 由自动生成的 script.js 重命名而来)。
index.html 的内容:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
data-sap-ui-async="true"
data-sap-ui-resourceroots='{
"sap.ui5.walkthrough": "./"
}'
data-sap-ui-oninit="module:sap/ui5/walkthrough/index">
</script>
</head>
<body>
<div>Hello World</div>
</body>
</html>
index.js 的内容:
sap.ui.define([
], function () {
"use strict";
alert("UI5 库文件已经加载就绪");
});
单击项目名称,可以对其进行重命名:
![](https://img.haomeiwen.com/i2085791/9130adfaf5c8cee5.png)
重命名结果:
![](https://img.haomeiwen.com/i2085791/54e6513cd0c7f18e.png)
点击 change URL,就可以看到这个应用的 url 了:
![](https://img.haomeiwen.com/i2085791/ba96463f67849e55.png)
发送给其他朋友,即可进行分享。比如在手机上打开:
![](https://img.haomeiwen.com/i2085791/79ba1b51c8dece1c.png)
更多Jerry的原创文章,尽在:"汪子熙":
![](https://img.haomeiwen.com/i2085791/97c4752c0e619c44.png)
网友评论