如下圖所示：

<script id="sap-ui-bootstrap"src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"data-sap-ui-theme="sap_bluecrystal"data-sap-ui-libs="sap.m, sap.ui.comp"data-sap-ui-bindingSyntax="complex" data-sap-ui-compatVersion="edge"data-sap-ui-preload="async"data-sap-ui-resourceroots='{"sap.ui.demo.CombineLatest": "./"}'> </script>

我剛學習 SAP UI5 時，對 data-sap-ui-resourceroots 的作用很是費解。

瀏覽我們開發的整個 SAP UI5 項目資源，無論是 Component.js:

還是視圖的控制器：

還是視圖的 id 本身，都包含了 sap.ui.demo.CombineLatest 的前綴：

如果我們把 index.html 里的 data-sap-ui-resourceroots 指令去掉：

會發現應用根本無法加載了，Chrome 開發者工具里報了很多資源文件無法加載的錯誤。

摘取其中一條錯誤消息出來分析。現在 Component.js 的加載路徑為：

https://sapui5.hana.ondemand.com/resources/sap/ui/demo/CombineLatest/Component.js

顯然，這個路徑是繼承自 index.html 里 id 為 sap-ui-bootstrap 里的 src 屬性定義的 SAP UI5 庫文件：

我們工程文件里的 Component.js, 其 id 為 sap.ui.demo.CombineLatest.Component：

SAP UI5 框架在加載時，將 id 轉換成 url：

sap/ui/demo/CombineLatest/Component.js,

然后在其頭部，拼接上來自 id 為 sap-ui-bootstrap 里的 src 屬性定義的 SAP UI5 庫文件的前綴：

https://sapui5.hana.ondemand.com/resources/

最后得到的路徑：

https://sapui5.hana.ondemand.com/resources/sap/ui/demo/CombineLatest/Component.js

顯然，這個路徑是錯誤的。因為 Component.js 僅僅存在于我們工程自身。

因此需要使用 data-sap-ui-resourceroots 告訴 SAP UI5 加載器，如果遇到前綴為 sap.ui.demo.CombineLatest 的本地資源文件，**不要使用 sap-ui-core.js **的前綴即 https://sapui5.hana.ondemand.com/resources，而是使用本地路徑./

修改之后，資源加載成功，正確的路徑應該是：http://localhost:3002/combine/Component.js

這個路徑是怎么來的呢？

(1) Component.js 的 id 為 sap.ui.demo.CombineLatest.Component，因為 data-sap-ui-resourceroots 生效，將 sap.ui.demo.CombineLatest.Component 替換成 ./Component

(2) ./Component 替換成 URL：/Component.js

(3) ./之前的 url 為 localhost:3002/combine

得到最后的絕對路徑去加載 Component.js:

http://localhost:3002/combine/Component.js

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

總結

以上是生活随笔為你收集整理的SAP UI5 应用 index.html 里 data-sap-ui-resourceroots 指令的含义和作用的全部內容，希望文章能夠幫你解決所遇到的問題。

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