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"

 

 

進入Template Wizard頁面,在 Application Type中,選擇“SAPUI5 freestyle”, 選擇“SAPUI5 Application”,點擊“NEXT”

 

 

選擇Data source:“None" 后點擊”NEXT“

(如果有系統或OData,可以選擇對應的選項)

 

 

輸入View name: V_Main, 繼續“NEXT”

 

 

輸入Module name等信息,點擊“FInish”

 

 

 生成成功后,會顯示如下頁面

 

 

2、運行應用

在創建好的應用上,右鍵,選擇“在集成終端中打開”

 

 

輸入命令: npm start 。

(要先安裝 node.js。  如下圖,選擇命令行)

 

 

VSCode會直接幫我們打開對應的網頁,

 

 3、加入我們的代碼

 在webapp/view/V_Main.view.xml中,加上代碼,保存后查看網頁

 

 

 

 

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM