generator-easy-ui5 的 Github 倉庫地址：

https://github.com/SAP/generator-easy-ui5

該工具是為了簡化 SAP UI5 應用創建而設計的。

使用下面的命令行安裝這個工具：

npm install -g yo generator-easy-ui5

安裝完畢后，執行命令行 yo：

如果看到上圖的輸出，說明 generator 安裝成功了。

選擇 Easy Ui5，回車。

報錯：unexpected token ‘.’

應該選擇 @sap/fiori, 然后顯示一個創建向導，逐一回復向導的問題，按回車鍵進入下一向導項。

自動生成的文件列表如下：

確保最后看到 Application generated successfully 的消息：

來看看 generator-easy-ui5 都幫助我們自動生成了哪些文件。

package.json 里的 devDependencies 和 dependencies：

"devDependencies": {"@ui5/cli": "^2.11.1","@ui5/fs": "^2.0.6","@ui5/logger": "^2.0.1","@sap/ux-ui5-tooling": "1","rimraf": "3.0.2"},"ui5": {"dependencies": ["@sap/ux-ui5-tooling"]}

script 區域有很多 fiori 命令行，來自 @sap/ux-ui5-tooling：

腳本 start 和 start-local 的區別，就在于使用 ui5.yaml 還是 ui5-local.yaml:

"start": "fiori run --open 'index.html'", "start-local": "fiori run --config ./ui5-local.yaml --open 'index.html'",

運行 npm run start:

成功打開 SAP UI5 頁面：

打開 ui5.yaml 文件，查看代理服務器配置：

specVersion: '1.0' metadata:name: 'project1' type: application ui5Theme: sap_fiori_3 server:customMiddleware:- name: fiori-tools-proxyafterMiddleware: compressionconfiguration:ignoreCertError: false # If set to true, certificate errors will be ignored. E.g. self-signed certificates will be acceptedbackend:- path: /sap/opu/odataurl: http://localhostui5:path: - /resources- /test-resourcesurl: https://ui5.sap.comversion: # The UI5 version, for instance, 1.78.1. Empty means latest version- name: fiori-tools-appreloadafterMiddleware: compressionconfiguration:port: 35729path: webapp

這個高亮區域的含義是，如果 SAP UI5 發起請求的 url 里包含了 /resources 或者 /test-resources, 那么 domain 自動被替換為 https://ui5.sap.com.

如果我們把 ui5.sap.com 改成 ui5.sap1.com, 就會看到期望中的 getaddrinfo ENOTFOUND ui5.sap1.com 錯誤：

當然，我們直接在 Chrome 開發者工具 network 標簽頁里是看不到請求是來自 https://ui5.sap.com 的：

https://ui5.sap.com/resources/sap-ui-core.js

有了這個 proxy 服務器之后，我們在 index.html 里不必引入 CDN 的 SAP UI5 庫，直接使用相對路徑 resources/sap-ui-core.js 即可:

更多Jerry的原創文章，盡在：“汪子熙”:

總結

以上是生活随笔為你收集整理的使用 generator-easy-ui5 快速创建 SAP UI5 应用的工程结构的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。