云服务器价格_云数据库_云主机【优惠】最新活动-搜集站云资讯

亚马逊云_京东云董事长_折扣

小七 141 0

SAP在SCP中提供一个好的IDE(称为sapwebide)方面投入了很多精力,现在仍然投入了很多精力。这个IDE提供了现成的工具来开发UI5应用程序。这些工具可以帮助您创建应用程序的构建、测试应用程序并将其部署到后端。除此之外,您还可以选择使用任何其他本地IDE。尽管如此,SAP并没有真正为此提供工具。对于本地开发,您必须使用几个第三方工具。第三方工具不是问题所在,但设置与UI5协同工作的所有工具所需的时间和精力都是一笔损失。

现在有了新的UI5工具,SAP提供了一个解决方案,弥补了本地UI5开发和SAP Web IDE之间的差距。它提供了替代第三方工具的工具,并为您提供了与SAP Web IDE中现成工具相同的可能性。

UI5工具是释放您的开发人员的关键使能器。开发人员可以选择SAP Web IDE或任何其他本地IDE。他们可以在任何IDE中使用所有工具来创建UI5应用程序。

SAP Web IDE非常棒,特别是对于初学者,但是经验丰富的UI5开发人员更喜欢他们本地的IDE。本地IDE,如VSCode,也提供了很好的开发体验。

在本博客中,我想分享如何使用新的UI5工具将UI5应用程序从SAP Web IDE迁移到本地IDE。我使用的是VSCode,我使用的是SAP的示例应用程序:

https://github.com/SAP/openui5-sample-app

为此,我将从GitHub上的UI5Con应用程序开始:

https://github.com/lemaiwo/UI5Con2019

新UI5工具的结果在此存储库中可用:

https://github.com/lemaiwo/ui5toolsexamplepp

您可以克隆我的UI5Con应用程序或在sapwebide中导出其中一个应用程序,人工智能的技术有哪些,并按照步骤操作。

让我们从安装开始UI5 CLI:

UI5工具正在使用一个额外的配置文件。您可以手动添加,但只需运行以下命令就可以轻松地添加。这将添加文件"ui5.yml":

它将在该文件中添加项目的名称和应用程序的类型(可以是应用程序或库)

添加对项目使用的ui5库的依赖关系。(这只在你想在本地测试时才需要,你也可以使用SDK的在线url)

这些命令会在包.json

您也可以通过将依赖项手动添加到"包.json只需运行"npm install"

删除"@sap/grunt-sapui5…."devDependency并添加以下只是开始:

在添加devdependencies后运行"npm install"。

接下来,添加基本脚本:

开始:根据webapp文件夹中的代码运行应用程序Lint:使用eslint对webapp文件夹中的代码运行基本代码检查Build:此命令将删除dist文件夹,并从webapp文件夹中生成代码以及在依赖项中定义的库。Sapbuild:与build命令相同,成都大数据,但只从webapp文件夹生成代码

Grunt不再需要,可以删除:

就像在sapwebide中一样,我们希望进行代码验证。因此,我们需要配置ESLint.

如果您没有配置lint而运行ESLint,它将给您以下错误:

npm run lint

ESLint需要配置,可以手动添加到您的项目中,也可以通过运行:

ESLint–init

这将生成一个基本的ESLint配置文件。

我已将以下配置添加到文件中"。eslintrc.json文件"为了支持箭头函数,游戏返利,扩展运算符,

我还添加了一个.eslintinignore file忽略libs文件夹中的所有文件。这不是我的代码,我也不会更改库:

如果您现在运行"npm run lint",您将得到如下内容:

构建过程是创建高效UI5应用程序的最重要步骤之一。它将通过生成每个文件的缩小和调试版本以及项目的组件预加载文件来创建代码的有效版本。这将加快你的应用程序加载时间!

我在包.json:

如果部署到SAP后端,则不希望部署资源文件夹中的库,因为资源文件夹已经在系统上。因此,我使用SAPBUILD命令。

使用SAPBUILD需要您使用联机SDK:

资源文件夹将只包含一个版本为:

的json文件,生成的结果如下:

UI5工具还提供了一个服务器在本地测试您的应用程序。通过运行以下语句在webapp文件夹中测试应用程序:

应用程序正在运行,但如果使用OData服务,则可能会出现以下错误:

解决方案在以下博客中解释:https://blogs.sap.com/2019/08/26/ui5-tooling-custom-server-middleware-proxy-extension/

增加依赖"服务"和一个脚本,为dist文件夹

Npm安装,世界人工智能,然后Npm运行开始:dist will从dist文件夹运行应用

最后,你应该有一个脚本,用proxy从webapp文件夹测试应用,从没有代理的dist文件夹和一个命令中包含build和proxy的dist文件夹:

这里详细说明:https://blogs.sap.com/2019/08/26/ui5-tooling-custom-server-middleware-proxy-extension/

最后一步,将应用程序部署到前端服务器。为此,我将使用模块"nwabap-ui5uploader"并添加一个脚本"deploy"

在这个脚本中填写您系统的所有细节:

Npm install安装节点模块并使用以下命令部署到您的后端: