Ttdfjt

How to tell your grandparent to not come to fetch you with their car?

Does the Long March-11 increase its thrust after clearing the launch tower?

Were Alexander the Great and Hephaestion lovers?

Meaning of 'lose their grip on the groins of their followers'

Mathematically, why does mass matrix / load vector lumping work?

Why can't I use =default for default ctors with a member initializer list

Which languages would be most useful in Europe at the end of the 19th century?

Is it legal for a bar bouncer to confiscate a fake ID

What to do when surprise and a high initiative roll conflict with the narrative?

Cascading Switches. Will it affect performance?

Fixing obscure 8080 emulator bug?

Does Disney no longer produce hand-drawn cartoon films?

Medieval flying castle propulsion

Generate basis elements of the Steenrod algebra

What's up with this leaf?

Should I give professor gift at the beginning of my PhD?

How can this tool find out registered domains from an IP?

Jargon request: "Canonical Form" of a word

Playing a Character as Unobtrusive and Subservient, Yet Not Passive

How to hide an urban landmark?

Soft question: Examples where lack of mathematical rigour cause security breaches?

Has there been a multiethnic Star Trek character?

is it possible for a vehicle to be manufactured witout a catalitic converter

Is it possible to have a wealthy country without a middle class?

Lots of jQuery conflicts on Magento 2

Getting TypeError: $.widget is not a function Magento 2Uncaught TypeError: undefined is not a function when using a jQuery plugin in MagentoMagento admin form date widget week number differs from jquery UI week numberJS errors Magento 2Jquery conflict with elastislide.js and prototype.jsWhy is js breaking with requirejs in templates on Magento 2 and how to fix?Continuing jQuery conflictsjQuery UI breaks when clicking on draggable element: “Cannot read property 'defaultView' of undefined”Add 2 jquery libraries to magento 2How to use third party jquery libraries in magento along with requirejs?Magento 2 - problem with mCustomscrollbar.js

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;

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.

magento2 javascript frontend jquery conflict

share|improve this question

asked Oct 2 '17 at 10:44

HollyHolly

2,36433882

add a comment | 

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.

magento2 javascript frontend jquery conflict

share|improve this question

asked Oct 2 '17 at 10:44

HollyHolly

2,36433882

add a comment | 

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.

magento2 javascript frontend jquery conflict

share|improve this question

asked Oct 2 '17 at 10:44

HollyHolly

2,36433882

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

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

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

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

share|improve this question

asked Oct 2 '17 at 10:44

HollyHolly

2,36433882

share|improve this question

asked Oct 2 '17 at 10:44

HollyHolly

2,36433882

asked Oct 2 '17 at 10:44

HollyHolly

2,36433882

asked Oct 2 '17 at 10:44

HollyHolly

2,36433882

1 Answer
1

active

oldest

votes

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>

share|improve this answer

answered Nov 6 '17 at 14:40

Cypher909Cypher909

20715

add a comment | 

Your Answer

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "479"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f195514%2flots-of-jquery-conflicts-on-magento-2%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

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>

share|improve this answer

answered Nov 6 '17 at 14:40

Cypher909Cypher909

20715

add a comment | 

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>

share|improve this answer

answered Nov 6 '17 at 14:40

Cypher909Cypher909

20715

add a comment | 

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>

share|improve this answer

answered Nov 6 '17 at 14:40

Cypher909Cypher909

20715

share|improve this answer

answered Nov 6 '17 at 14:40

Cypher909Cypher909

20715

answered Nov 6 '17 at 14:40

Cypher909Cypher909

20715

answered Nov 6 '17 at 14:40

Cypher909Cypher909

20715