SAP UI5 hello world

侠岚仙

已于 2022-11-28 15:53:42 修改

阅读量349

点赞数 1

文章标签： ui 前端

于 2022-11-28 13:32:00 首次发布

本文链接：https://blog.csdn.net/weixin_43922846/article/details/128077748

版权

1,安装ui5

cmd打开(如果nodejs未配置环境变量可能找不到命令),输入下面命令

npm install --global @ui5/cli

2.创建你的项目的文件夹app1，用vscode进入app1文件夹后，执行init

npm init --yes

3.在app1里创建webapp文件夹

4，在app1文件夹里执行，生成ui5.yaml

ui5 init

注意：在windows下的vscode的命令行下执行此命令会出下面的错误：

ui5 : C:\Users\aaa\App Data\Roaming\npm\ui5.ps1 「about_Execution_Polic ies」(https://go.microsoft.com/fwlink/?LinkID=135170) + ui5 init + ~~~ + FullyQualifiedErrorId : UnauthorizedAccess

解决办法：管理员身份运行powershell，执行Set-ExecutionPolicy RemoteSigned命令，然后有个提示，然后输入A，就可以了。
参考：【PowerShell】外部ファイル実行時にポリシーエラーが発生する際の対処方法 - かえでBlog

5.在webapp里创建manifest.json文件

{
    "sap.app": {
        "id": "sap.ui.demo.walkthrough"
    }
}

6.在app1文件夹里执行,会更新ui5.yaml,@后面是版本号,latest为最新,其他就是指定某个版本

ui5 use SAPUI5@latest

ui5 use SAPUI5@1.90.14

7.在webapp文件夹下创建index.html文件

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>SAPUI5 Walkthrogh</title>
    </head>
    <body>
        <div>Hello Word</div>
    </body>
</html>

8.启动server，在app1文件夹下执行

ui5 serve