javascript - 在Moodle插件中使用外部JavaScript库中的函数

我正在制作一个Moodle插件，并想使用bowser来检测用户的Web浏览器。我通过把引用文件

$PAGE->requires->js( new moodle_url($CFG->wwwroot.MOODLE_TINYMCE_RECORDRTC_ROOT.'tinymce/js/bowser.js') );

在插件的plugintype_pluginname.php文件中（当然是占位符），然后从插件的bowser文件中调用module.js函数。

当我加载插件（它在TinyMCE中显示为按钮）时，控制台会抛出ReferenceError: bowser not defined，因此我假设这意味着Moodle无法使Bowser中的功能全局可用。

我读过很多地方，需要将代码包装在AMD中或达到这种效果的许多地方，但是经过大量阅读后，这些问题仍然困扰着我。有什么方法可以使Bowser的功能可用于主插件模块？

最佳答案

注意：这在Moodle 3.3.2，ymmv中对我有效。

将bowser.js放入my_plugin_folder/amd/src/。

当使用原始的bowser.js时，我得到了Uncaught TypeError: bowser._detect is not a function。我不完全理解为什么会出现此错误，但这是解决此错误的一种方法：将bowser.js中的顶部代码块替换为this one中的umdjs/umd。

您的文件现在应如下所示：

(function (root, factory) {
    if (typeof define === 'function' && define.amd) {
        // AMD. Register as an anonymous module.
        define([], factory);
    } else if (typeof module === 'object' && module.exports) {
        // Node. Does not work with strict CommonJS, but
        // only CommonJS-like environments that support module.exports,
        // like Node.
        module.exports = factory();
    } else {
        // Browser globals (root is window)
        root.returnExports = factory();
    }
}(typeof self !== 'undefined' ? self : this, function () {

    // module definition here

    return bowser
}));

Moodle将所有JavaScript模块捆绑在一起，因此客户端无需执行单独的HTTP请求即可获得每个请求。该捆绑包称为first.js。它包含所有不是延迟加载的模块。如果现在加载Moodle页面，则该页面应包含bowser.js的内容，并用Moodle替换某些值。

如果您不希望在每个页面上加载Bowser，则可以将其重命名为bowser-lazy.js。然后，仅应在使用时加载它。



您可以通过以下方法测试它是否有效：

require(['plugintype_pluginname/bowser'], function(bowser) {
    var ua = bowser._detect(navigator.userAgent);
    console.log(ua);
});

似乎当您要使用延迟加载时，需要将require调用更改为使用bowser-lazy而不是bowser。

关于javascript - 在Moodle插件中使用外部JavaScript库中的函数，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44855320/