VS Code开发SAPUI5应用

开发SAPUI5应用时, sap 自己的WEBIDE越来越难用。还好我们可以用Visual Studio Code来替代webide,详见sap自己的文章

Develop and Run SAP Fiori Application with Visual Studio Code

 

环境准备

VS Code - https://code.visualstudio.com/

Node JS- https://nodejs.org/en/download/

VSCode插件  SAP Fiori tools 

 

创建SAPUI5本地应用(官方教程能直接在sap上创建好磁贴,但练习时我们未必会有sap系统,因此只能创建本地应用)

1、打开VSCode, 点击菜单【查看】-【命令面板】打开命令面板(快捷键ctrl+shift+p),并输入Fiori,选择 "Fiori: Open Applicatio Generatior"

VS Code开发SAPUI5应用

 

 

进入Template Wizard页面,在 Application Type中,选择“SAPUI5 freestyle”, 选择“SAPUI5 Application”,点击“NEXT”

VS Code开发SAPUI5应用

 

 

选择Data source:“None" 后点击”NEXT“

(如果有系统或OData,可以选择对应的选项)

VS Code开发SAPUI5应用

 

 

输入View name: V_Main, 继续“NEXT”

VS Code开发SAPUI5应用

 

 

输入Module name等信息,点击“FInish”

 VS Code开发SAPUI5应用

 

 生成成功后,会显示如下页面

VS Code开发SAPUI5应用

 

 

2、运行应用

在创建好的应用上,右键,选择“在集成终端中打开”

VS Code开发SAPUI5应用

 

 

输入命令: npm start 。

(要先安装 node.js。  如下图,选择命令行)

VS Code开发SAPUI5应用

 

VS Code开发SAPUI5应用

 

VSCode会直接帮我们打开对应的网页,

VS Code开发SAPUI5应用

 

 3、加入我们的代码

 在webapp/view/V_Main.view.xml中,加上代码,保存后查看网页

VS Code开发SAPUI5应用

 

 

VS Code开发SAPUI5应用

 

 

 

 

 

上一篇:洒出VS的受调查


下一篇:独立软件开发商