Magento 2覆盖模块的JS,但在第一个请求依赖项上未加载

Nom*_*man 9 javascript php magento magento2

我想更改第三方模块的HTML布局,该模块在产品描述页面的数量输入字段上显示INC / DEC按钮。

为此,我必须重写我所做的并且工作正常的第三方模块的JS。

问题是,在第一个具有空缓存的请求上,它的依赖项未加载并出现以下错误:

TypeError: $.widget is not a function (\app\code\MyCompany\General\view\frontend\web\js\qtycontrol.js)
TypeError: $(...).qtycontrol is not a function (where it has been called)
Run Code Online (Sandbox Code Playgroud)

刷新页面一次,使其工作正常。

请在下面找到我创建要覆盖的模块的代码以及原始第3方模块的代码的详细信息。

替代模块(\ app \ code \ MyCompany \ General \ view \ frontend \ web \ js \ qtycontrol.js):

;define([
    'jquery',
    'jquery/ui'],
(function ($, window, document, undefined) {
    $.widget("infortis.qtycontrol", {
        , _create: function()
        {
            this._initPlugin();
        }
        , _initPlugin: function()
        {
            //Exetnded code to display inc/dec buttons on the quantity input field but with changes in HTML.
        }
    }); //end: widget
})(jQuery, window, document));
Run Code Online (Sandbox Code Playgroud)

覆盖模块(\ app \ code \ MyCompany \ General \ view \ frontend \ requirejs-config.js):

var config = {
    map: {
        '*': {
            'qtycontrol': 'MyCompany_General/js/qtycontrol'
        }
    }
};
Run Code Online (Sandbox Code Playgroud)

替代模块(\ app \ code \ MyCompany \ General \ etc \ module.xml):

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="MyCompany_General" setup_version="1.0.0">
        <sequence>
            <module name="Infortis_Base"/>
        </sequence>
    </module>
</config>
Run Code Online (Sandbox Code Playgroud)

第三方原始模块(\ app \ code \ Infortis \ Base \ view \ frontend \ web \ js \ qtycontrol.js):

;(function ($, window, document, undefined) {
    $.widget("infortis.qtycontrol", {
        , _initPlugin: function()
        {
            //Some code to display inc/dec buttons on the quantity input field.
        }
    }); //end: widget
})(jQuery, window, document);
Run Code Online (Sandbox Code Playgroud)

第三方原始模块(\ app \ code \ Infortis \ Base \ view \ frontend \ requirejs-config.js):

var config = {
    paths: {
        'qtycontrol': 'Infortis_Base/js/qtycontrol'
    },
    shim: {
        'qtycontrol': {
            deps: ['jquery', 'jquery/ui']
        }
    }
};
Run Code Online (Sandbox Code Playgroud)

我正在以下环境中运行该应用程序:

  • 操作系统=> Windows。
  • 套餐=> WAMP

我是Magento 2的新手,但是对PHP和基本的JavaScript概念非常了解。但是可能会缺少一些基本概念。任何帮助,将不胜感激。

小智 1

Magento 建议使用mixins而不是覆盖整个 JS 文件。

您可以访问链接,那里还给出了一个示例,我相信会有所帮助。