Javascript Magento 2覆盖模块的JS,但在第一次请求时不加载依赖项

Javascript Magento 2覆盖模块的JS,但在第一次请求时不加载依赖项,javascript,php,magento,magento2,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 no

我想更改第三方模块的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)
刷新页面一次,使其正常工作

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

覆盖模块(\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));
var config = {
    map: {
        '*': {
            'qtycontrol': 'MyCompany_General/js/qtycontrol'
        }
    }
};
<?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>
;(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);
var config = {
    paths: {
        'qtycontrol': 'Infortis_Base/js/qtycontrol'
    },
    shim: {
        'qtycontrol': {
            deps: ['jquery', 'jquery/ui']
        }
    }
};
覆盖模块(\app\code\MyCompany\General\view\frontend\requirejs config.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));
var config = {
    map: {
        '*': {
            'qtycontrol': 'MyCompany_General/js/qtycontrol'
        }
    }
};
<?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>
;(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);
var config = {
    paths: {
        'qtycontrol': 'Infortis_Base/js/qtycontrol'
    },
    shim: {
        'qtycontrol': {
            deps: ['jquery', 'jquery/ui']
        }
    }
};
覆盖模块(\app\code\MyCompany\General\etc\Module.xml):

;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));
var config = {
    map: {
        '*': {
            'qtycontrol': 'MyCompany_General/js/qtycontrol'
        }
    }
};
<?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>
;(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);
var config = {
    paths: {
        'qtycontrol': 'Infortis_Base/js/qtycontrol'
    },
    shim: {
        'qtycontrol': {
            deps: ['jquery', 'jquery/ui']
        }
    }
};
第三方原始模块(\app\code\Infortis\Base\view\frontend\requirejs config.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));
var config = {
    map: {
        '*': {
            'qtycontrol': 'MyCompany_General/js/qtycontrol'
        }
    }
};
<?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>
;(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);
var config = {
    paths: {
        'qtycontrol': 'Infortis_Base/js/qtycontrol'
    },
    shim: {
        'qtycontrol': {
            deps: ['jquery', 'jquery/ui']
        }
    }
};
我正在以下环境中运行应用程序:

  • 操作系统=>Windows
  • Package=>WAMP
因为我不熟悉Magento 2,但对PHP和基本JavaScript概念非常了解。但这可能会遗漏一些基本概念。任何帮助都将不胜感激。

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


你可以点击下面的链接,这里还有一个例子,我相信这会有帮助。

你确定刷新代码时包含javascript代码吗?你是在问,一旦我们刷新,它是否可以加载?是的,一旦我们重新加载页面,它就会出现。是的,我在问代码是您的javascript调用还是您的主题javascript调用。是否可以共享网站的url?共享url对我来说是不可能的,因为它是客户的项目。是的,我的主题中使用“qtycontrol”方法的代码在一次或两次刷新后可以正常工作。您可以在Infortis qtycontrol.js文件中发出警报消息吗