0

I'm working on a new Magento 2 installation with the Porto theme and have noticed that when you first visit the site or have the browser cache disabled you get a lot of of jQuery conflict errors. Below are examples of these errors from both the theme and core Magento2.

examples:

(index):394     Uncaught TypeError: $(...).swMegamenu is not a function
dataPost.js:13  Uncaught TypeError: $.widget is not a function

When I look how these jQuery functions are being initiated, I see it's using requireJs correctly to load jQuery.

<script type="text/javascript">
    require([
        'jquery',
        'Smartwave_Megamenu/js/sw_megamenu'
    ], function ($) {
        $(".sw-megamenu").swMegamenu();
    });
</script>

AND

define([
    "jquery",
    "mage/template",
    "jquery/ui"
], function($,mageTemplate){

    $.widget('mage.dataPost', {......

I can fix it by adding var $ = jQuery.noConflict(); at the beginning of the function block (but this seems redundant as $ is already passed as a parameter to the function, it works though!)

Also, I can fix it by Merging all JS as suggested in answer to this question.

Merging the JS seems to be a good fix but I'd like to better understand why this is happening and the best approach to solving it.

0

I had this issue as well but then I ran across this article: http://www.danjoseph.me/2016/09/16/magento-2-widget-not-function/

In the article he explains that jquery was being loaded a second time on the page and therefore overwriting the version loaded previously by magento. For me it was a marketing script that was also loading jquery for some reason. jQuery should only be loaded once in the head by this tag and all others should be removed.

<script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="jquery" src="http://seatup.local/pub/static/frontend/Seatup/theme/en_US/jquery.js"></script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.