无法访问 includeScript 函数包含的外部 JS 库

Question

我尝试测试 includeScript 函数以在加载 UI5 页面后加载外部 js 库。它适用于所有情况，这意味着在加载脚本后，它就可以访问了。但是，如果有 ChartContainer 控件，则无法访问加载的 JS 库。

工作案例，选择地图容器控件的示例页面：https://sapui5.hana.ondemand.com/#/entity/sap.ui.vk.MapContainer/sample/sap.ui.vk.sample.MapContainerBasic，加载页面后，打开开发者工具，运行控制台面板中的下面的脚本。




var includeScript = sap.ui.require("sap/ui/dom/includeScript");
try {
  dateFns.isToday(new Date());
} catch (err) {
  new Promise(function(fnResolve, fnReject) {
    includeScript(
          "https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.min.js", 
          "datefns_js", fnResolve, fnReject);
 }).then(function() {
     console.log("datefns_js is loaded!!!")
     console.log(dateFns.isToday(new Date()));
 });
}

<script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"></script>

加载 dateFns 后，执行下一条命令：

dateFns.isToday(new Date());

在控制台中 returns 为真，因为 dateFns js 已加载并可访问。

None工作案例，具体在测试ChartContainer控件时，在新会话中打开图表容器控件示例页面：https://sapui5.hana.ondemand.com/#/entity/sap.suite.ui.commons.ChartContainer/sample/sap.suite.ui.commons.sample.ChartContainerSimpleToolbar 打开开发者工具，重复上述步骤。错误发生为 "Uncaught ReferenceError: dateFns is not defined"，因为库已加载但无法访问。

我希望我的 UI.

中的任何控件都可以访问加载的外部 js 库

Answer 1

来自SAPUI5 documentation：

Modules that use Unified Module Definition (UMD) syntax, can be loaded, but only when no AMD loader is present or when they expose their export also to the global namespace, even when an AMD loader is present

不幸的是，SAPUI5 图表使用另一个 AMD 加载程序 (RequireJS)，因此您的模块 date-fns 将使用 RequireJS 加载并且不可用于全局 window 对象。

要解决此问题，您可以强制模块始终通过 RequireJS 加载，然后通过 require 方法可用：

<script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"></script>

<script>
var declareLibs = new Promise(function (resolve, reject) {
    sap.ui.require(["sap/ui/thirdparty/require"], function () {
        requirejs.config({
            paths: {
                "date_fns": ["//cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.min"]
            }
        });

        resolve();
    });
});

declareLibs.then(require(["date_fns"], function (dateFns) {
    console.log("datefns_js is loaded!")
    console.log(dateFns.isToday(new Date()));
}));
</script>

无法访问 includeScript 函数包含的外部 JS 库

External JS lib included by includeScript function is not accessible

sapui5