Magento 2 replace a core javascript

Question

I was trying to replace magento 2 core javascript file for Swatches render which is located at app/code/Magento/Swatches/view/frontend/web/js/SwatchRenderer.js . And I followed official guide for this - http://devdocs.magento.com/guides/v2.0/javascript-dev-guide/javascript/custom_js.html , but it did not work.

I have uploaded my module on GIT. Can someone check and tell me what is the issue ? Here is the GIT Link for the module created - https://github.com/chamalC/magento-2-replace-javascript/tree/master/app/code/Muaw/CustomSwatches

Answer 1

Try below code in your requirejs-config.js

 var config = {
     map: {
    '*': {
        swatchRenderer: 'Muaw_CustomSwatches/js/SwatchRenderer'
    }
}};

Answer 2

The code works for me on Magento 2.1.5

var config = {
    map: {
        '*': {
           'Magento_Swatches/js/swatch-renderer':'Vendor_Module/js/swatch-renderer'     
        }
    }
};

Answer 3

There is an Easy way out for that when you do that changes while creating a custom Theme,

Firstly override the template File in which the Js is being called i.e module-swatches/view/frontend/templates/product/view/renderer.phtml and change the line

"Magento_Swatches/js/swatch-renderer" 

to

"Magento_Swatches/js/swatch-renderer-custom"

Secondly create a js file in web/js Directory named swatch-renderer-custom.js Then if you apply any code in that js file then your code will be called....

Answer 4

Try below based on docs of magento 2 inside requirejs-config.js file, You have to do below,

var config = {
    map: {
        '*': {
            swatchRenderer:'Magento_Swatches/js/SwatchRenderer'
        }
    }
};

Answer 5

Using Mixins:
var config = {
    config: {
        mixins: {
            'Magento_Swatches/js/swatch-renderer': {
                'Ayasoftware_EnhancedConfigurable/js/swatches': true
            }
        }
    },
    }
};