Constr is not a constructor on layout.js line 137 error custom module
-
26-01-2021 - |
题
I have gone through this posts and tried to implement the answers and suggestions
Magento2 getting 'Constr is not a constructor' error for custom theme && Error in layout.js, cart not loading && No Way to Clear/delete a Selected Image using Media Browser on category edit page
But I am not able to resolve this issue .
Here is what I have done -> I am trying to reuse module-checkout/view/frontend/web/js/view/billing-address.js file in my custom module, Here is what I have done so far
This is my registration.js file
<?php
\Magento\Framework\Component\ComponentRegistrar::register(
\Magento\Framework\Component\ComponentRegistrar::MODULE,
'Rahul_Learning',
__DIR__
);
This is Rahul/Learning/etc/module.xml file
<?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="Rahul_Learning" setup_version="0.0.1"/>
</config>
This is Rahul/Learning/view/frontend/requirejs-config.js
var config = {
config: {
mixins: {
'Magento_Checkout/js/view/billing-address': {
'Rahul_Learning/js/view/billing-address': true
}
}
}
};
and at location Rahul/Learning/view/frontend/web/js/view I have copy pasted module-checkout/view/frontend/web/js/view/billing-address.js file without any changes but I am getting this error on checkout page
Looking forward for your suggestions not sure what I am doing wrong here.
Thanks
解决方案
You should avoid the copy-paste technique as much as possible.
In your requirejs-config.js
you are declaring that you would like to apply mixins to Magento_Checkout/js/view/billing-address
with Rahul_Learning/js/view/billing-address
.
The original component, i.e. Magento_Checkout/js/view/billing-address
when applying mixins, is referred to as the target
, and inside the component that does the override of the target, you will ALWAYS get A REFERENCE TO THE TARGET.
The code then, in your .js file should be like
define([], function(){
'use strict';
return function(originalBillingAddress){
return originalBillingAddress.extend({
//YOUR NEW CODE GOES HERE
});
};
});
So, in this example the variable originalBillingAddress
would be the original object that comes from Magento_Checkout/js/view/billing-address
and you return
AN EXTENSION of it by using the .extend
function.
I have left the define([], function(){
as empty, but, as by default RequireJS functionality, you can pass any dependencies here that you like, for example
define(['jquery'], function($){
this way you load jQuery
and refer to it later as $
.
I hope this helps.
其他提示
I am not sure whether this is the correct answer or not but this fix the issue hope it will help someone so I am posting here .
Made changes to requirejs-config.js and the error I was facing is gone.
var config = {
"map": {
"*": {
"Magento_Checkout/js/view/billing-address":"Rahul_Learning/js/view/billing-address"
}
}
};