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



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

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

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

TypeError: $.widget is not a function (appcodeMyCompanyGeneralviewfrontendwebjsqtycontrol.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));

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

var config = {
map: {
'*': {
'qtycontrol': 'MyCompany_General/js/qtycontrol'
}
}
};

覆盖模块(\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>

第三方原始模块(\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);

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

var config = {
paths: {
'qtycontrol': 'Infortis_Base/js/qtycontrol'
},
shim: {
'qtycontrol': {
deps: ['jquery', 'jquery/ui']
}
}
};

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

  • 操作系统 => 窗口。
  • 套餐 => WAMP

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

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

你可以去链接那里也给出了一个例子,我相信这会有所帮助。

最新更新