一个 SAP UI5 脚手架应用，可以同时管理多个UI5应用原创

大家好，我是汪，今天这个视频给大家介绍一个之前我的公众号文章里面经过的于PY5学习的脚手架应用。这个视频会介绍这个应用的具体使用方式。那无论我是用UI5还是用进行我的日常开发工作。每当我需要调研一些新的。框架feature的时候，我都喜欢使用这些脚手架应用来完成，因为这样的话可以隔离已经开发出来的功能以及业务逻辑，那么让我能够以最高的效率。在那些我真正想要去调研的。那这个脚手架应用的地址是在我的github上面。

大家可以从这个链接上到本地。克隆到本地之后具体怎么用呢？首先直接n PM in store安装所有的依赖。然后直接用note JS启动。Node local.js这个命令行，然后这个脚手架应用就启动好了。我们打开这个脚手架应用，发现它是一个基于note JS的应用，那么在package.js这个文件里面定义了这个应用的依赖，其中最主要的依赖就是这个express。一个基于note JS实现的web serve的。那么我们其实。我们的UI5应用也是运行在这个express server上的，我们之前命令行里面的这个点JS。

这个就是应用的入口，我们可以去看一下里面有哪些逻辑。那么默认情况下，如果我们。在3002这个硬编码的默认端口访问这个应用的话，我们会看到一个你好，Hollywood的字符串返回。到我们的浏览器里面。比如说。那如果看到你好的话，就证明这个脚手架应用已经启动成功，没有任何问题了。这里我们看到的一段代码就是一些映射逻辑，那么它的语义是说。当我在localhost冒号3002这个URL后面添加一个UI5。的这个UR片段的时候，那么这个时候脚手架应用会加在web APP这个文件夹里面包含的。

点g X view，还有控制器之类的资源，那么我们看一下在我们左边的这个项目文件里，列表里面确实有一个web APP。的这样一个文件夹存在，那么里面就是很典型的UI的这个应用。所以这个脚手应用它其实是一系列UI应用的合，那么因为我比如说我日常工作，我的工作中需要研究很多一外五的feature。那么我觉得为每一个feature单独创建一个UI应用，这个管理起来太麻烦太繁琐了，所以我就采用这种方式，脚手架应用的方式，在一个脚手架应用里面通过多个U2来映射到不同的。

UI应用，所以这个这个脚手架应用实际是一系列UI5应用的一个集合。比如说我们现在看一下localhost冒号3002，后面加上一个UI5。这个U片段之后会看到一个什么样的应用？啊，那么这个应用就是一个很典型的EI5里面所谓master。这种pattern的应用左边是一个master list，我们可以在这些list里面切换不同的行项目，那么右边就是这个行项目的明细页面。那这个其实就展示了这种最典型的master，它的开发方式。所以如果大家要学习UI5MUST detail这种pattern的。开发细节的话，就可以到这个web APP的这个文件夹里面去做。

然后这个例子就是UI12后面加上一个，那么很显然它是展示UI5应用的。数控件的一个用法。这个是外文应用数控件的一个。具体的例子。那么这个所谓的smart field smart table。这些就是我之前公众号文章里面介绍。SAP fury element这个框架里面的一些技术细节，当时用到的一些UI5应用。这个o table应该就是我刚刚写过的，就是一个朋友询问怎么样在里面实现。页面的自动刷新。所以我们看一下。

好，这就是一个页面的自动刷新，因为我当时公众号文章里面把这个的刷新频率很。应该是0.1秒，所以说。我们就会看到它刷新的频率非常快，所以在这里把它重新改成比如说。三秒刷新一次。我们可以看到在这个地方做了修改之后。代码做了修改之后，我们到浏览器上刷新，它是立即生效的，所以这个脚手架应用使用起来也非常方便。不像之前用Tom那样，可能需要做一些配置。这个脚手夹应用直接使用express server来启动UI5应用，它速度也也非常快。好，现在刷新已经变成了三秒一次。

这就是这个UI5脚手架应用的具体用法。如果大家自己需要实现新的feature，或者说是调研UI新的功能的时候，其实也可以直接往这个脚手架应用里面添加。在这个地方添加一个新的分支。比如说这个U2改成A，然后这个folder改成B。那么你把你的UI5应用。全部放到这个folder，把UI5应用的实现放到这个folder b里面，然后你在local host。这个幺二后面加上B的话。呃，加上这个U2的话。那么运行时。B folder里面的资源就会被加载。B folder里面实现的UI5应用就会出现在浏览器的这个界面里面。

这就是脚，这个脚舌尖用的具体用法。如果大家对这个应用有什么意见的话。欢迎留言。我们下个视频，再见。感谢观看。