首页 > 解决方案 > 如何确保 Magento 2 中的 RequireJS 在加载其他脚本之前加载 jQuery?我发现嵌套需要解决这个问题

问题描述

我正在尝试加载一个需要 jQuery 才能运行的惰性加载器插件。如果我这样写我的脚本:

require([
        "jquery",
        "ScandiLazy",
    ], function ($) {
        jQuery('.category-products .lazy').lazy();
    });

我得到:

"jquery.lazy.min.js:43 Uncaught TypeError: Cannot read property 'fn' of undefined",

其次是:

Uncaught TypeError: jQuery(...).lazy is not a function

这是一个错误,因为没有加载 jQuery。

但如果我嵌套要求:

 require([ "jquery"], function ($) {
        require([ "ScandiLazy"], function ($) {
            jQuery('.category-products .lazy').lazy();
        });
    });

然后它完美地工作。

但是为了使其工作而嵌套需求感觉是错误的,这实际上是正确的方法吗?

如果这是不正确的,那么在加载 ScandiLazy 延迟加载插件之前绝对确保加载 jQuery 的方法是什么?

标签: javascriptjqueryrequirejsmagento2

解决方案


ScandiLazy需要 jQuery 才能工作,所以你必须告诉 RequireJS 设置jQueryScandiLazy使用的依赖项shim(更多在这里https://requirejs.org/docs/api.html#config-shim)。快速示例如何解决此问题:

requirejs.config({ // configure RequireJS first
    shim: {
        'path/to/ScandiLazy': ['jquery']
    }
});

require([ // load modules
    "jquery",
    "ScandiLazy",
], function ($) {
    jQuery('.category-products .lazy').lazy();
});

推荐阅读